/* Import Inter font from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* PolarixPay Styles - VERSIÓN COMPACTA v1.4.3 */

/* =================================================================
   CRITICAL - MÁXIMA PRIORIDAD PARA IMÁGENES
   ================================================================= */

.polarixpay-wrapper img[alt="USDC"],
.polarixpay-wrapper img[alt="USDT"],
.polarixpay-wrapper img[alt="BTC"],
.polarixpay-wrapper img[alt="Arbitrum"],
.polarixpay-wrapper img[alt="Ethereum"],
.polarixpay-wrapper .currency-icon,
.polarixpay-wrapper .network-icon,
div.polarixpay-wrapper img.currency-icon,
div.polarixpay-wrapper img.network-icon {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    position: relative !important;
    z-index: 1 !important;
    filter: none !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

/* =================================================================
   RESET Y AISLAMIENTO
   ================================================================= */

/* =================================================================
   RESET Y AISLAMIENTO - ESPECÍFICO PARA FOOTERS
   ================================================================= */

/* Headers y footers - SIEMPRE ocultos */
body.page-template-default .site-header,
body.page-template-default header:not(.polarixpay-header),
body.page-template-default .header,
body.page-template-default .site-footer,
body.page-template-default footer,
body.page-template-default .footer,
body.page-template-default .entry-header,
body.page-template-default .page-header,
body.page-template-default .entry-title,
body.page-template-default h1.entry-title,
body.page-template-default .breadcrumbs,
body.page-template-default .breadcrumb,
body.page-template-default nav:not(.woocommerce-breadcrumb),
body.page-template-default .navigation,
/* Barra inferior mobile - MÁS SELECTORES */
body.page-template-default .mobile-menu-panel,
body.page-template-default .mobile-navigation-bar,
body.page-template-default .em-navigation-bar,
body.page-template-default #mobile-menu-panel,
body.page-template-default .bottom-bar,
body.page-template-default .sticky-bottom-bar,
.ecomobile-mobile-navigation-bar,
.mobile-bottom-bar,
.handheld-footer-bar,
.storefront-handheld-footer-bar,
#handheld-footer-bar,
.site-footer,
#colophon,
.footer-wrapper,
.bottom-navigation {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
}

body.page-template-default .site-content,
body.page-template-default .content-area,
body.page-template-default main,
body.page-template-default article,
body.page-template-default .entry-content {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

body.page-template-default {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 100vh !important;
    overflow-x: hidden !important;
}

/* =================================================================
   VARIABLES
   ================================================================= */

:root {
    --polarix-orange: #ff6b35;
    --polarix-orange-hover: #ff8555;
    --polarix-dark: #1a1a1a;
    --polarix-gray: #6b7280;
    --polarix-light-gray: #f3f4f6;
    --polarix-white: #ffffff;
    --polarix-success: #22c55e;
    --polarix-border: #e5e7eb;
    --polarix-shadow: rgba(0, 0, 0, 0.1);
}

/* =================================================================
   RESET COMPLETO DENTRO DEL WRAPPER
   ================================================================= */

.polarixpay-wrapper,
.polarixpay-wrapper * {
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
    line-height: 1.5 !important;
}

/* =================================================================
   WRAPPER - FORZAR COLUMNA VERTICAL Y CENTRADO
   ================================================================= */

.polarixpay-wrapper {
    min-height: 100vh !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    position: relative !important;
    isolation: isolate !important;
}

/* En mobile, asegurar visibilidad */
@media (max-width: 768px) {
    .polarixpay-wrapper {
        position: relative !important;
        z-index: 1 !important;
    }
}

/* =================================================================
   TABS - ARRIBA Y CENTRADAS
   ================================================================= */

.polarixpay-tabs {
    display: flex !important;
    flex-direction: row !important;
    background: rgba(255, 255, 255, 0.95) !important;
    padding: 6px !important;
    gap: 6px !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    backdrop-filter: blur(10px) !important;
    width: 100% !important;
    max-width: 440px !important;
    margin-bottom: 16px !important;
    order: 1 !important;
    position: relative !important;
    z-index: 10 !important;
}

.polarixpay-tab {
    flex: 1 !important;
    padding: 10px 20px !important;
    border: none !important;
    background: transparent !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--polarix-gray) !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
}

.polarixpay-tab.active {
    background: var(--polarix-white) !important;
    color: var(--polarix-dark) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

.polarixpay-tab:hover:not(.active) {
    color: var(--polarix-dark) !important;
}

/* =================================================================
   MAIN CONTAINER - MÁS COMPACTO
   ================================================================= */

.polarixpay-container {
    width: 100% !important;
    max-width: 440px !important;
    background: var(--polarix-white) !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 60px var(--polarix-shadow) !important;
    overflow: hidden !important;
    position: relative !important;
    z-index: 1 !important;
    order: 2 !important;
}

/* =================================================================
   CONTENT - REDUCIR PADDING
   ================================================================= */

.polarixpay-content {
    padding: 24px !important;
}

.polarixpay-tab-content {
    display: none !important;
    position: relative !important;
}

.polarixpay-tab-content.active {
    display: block !important;
    animation: fadeIn 0.3s ease !important;
    position: relative !important;
    min-height: 500px !important;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =================================================================
   MOBILE WALLETS GRID
   ================================================================= */

.polarixpay-mobile-wallets {
    display: grid;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
}

.polarixpay-wallet-btn {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    background: var(--polarix-light-gray) !important;
    border: 2px solid var(--polarix-border) !important;
    border-radius: 14px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--polarix-dark) !important;
}

.polarixpay-wallet-btn:hover {
    background: var(--polarix-white) !important;
    border-color: var(--polarix-orange) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px var(--polarix-shadow) !important;
}

.wallet-icon {
    font-size: 28px !important;
    margin-bottom: 6px !important;
}

.wallet-icon-img {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 8px !important;
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.wallet-name {
    margin: 0 !important;
}

/* =================================================================
   HEADER - MÁS COMPACTO
   ================================================================= */

.polarixpay-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 20px !important;
}

.polarixpay-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--polarix-dark) !important;
    margin: 0 !important;
}

.polarixpay-currency {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 14px !important;
    background: var(--polarix-light-gray) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 50 !important;
}

.polarixpay-currency:hover {
    background: var(--polarix-border) !important;
}

.currency-icon {
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
}

.currency-name {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--polarix-dark) !important;
}

.currency-toggle {
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    color: var(--polarix-gray) !important;
    padding: 0 !important;
    margin-left: 2px !important;
    transition: transform 0.3s ease !important;
}

.polarixpay-currency.active .currency-toggle {
    transform: rotate(180deg) !important;
}

/* Currency Dropdown */
.polarixpay-currency-dropdown {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--polarix-white) !important;
    border: 2px solid var(--polarix-border) !important;
    border-radius: 10px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-5px) !important;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s !important;
    z-index: 9999 !important;
    pointer-events: none !important;
}

.polarixpay-currency-dropdown.open {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

.currency-option {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 14px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

.currency-option:not(:last-child) {
    border-bottom: 1px solid var(--polarix-border) !important;
}

.currency-option:hover:not(.disabled) {
    background: var(--polarix-light-gray) !important;
}

.currency-option.disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

.currency-option img {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
}

.currency-option span {
    flex: 1 !important;
    font-size: 13px !important;
    color: var(--polarix-dark) !important;
    font-weight: 500 !important;
}

/* Ocultar checkmark completamente */
.currency-option .checkmark,
.currency-option:not(.active) .checkmark {
    display: none !important;
}

/* =================================================================
   NETWORK SELECTOR - MÁS COMPACTO
   ================================================================= */

.polarixpay-network {
    position: relative !important;
    margin-bottom: 20px !important;
}

.polarixpay-network-btn {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px !important;
    background: var(--polarix-white) !important;
    border: 2px solid var(--polarix-border) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.polarixpay-network-btn:hover {
    border-color: var(--polarix-orange) !important;
}

.network-icon {
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
}

.network-name {
    flex: 1 !important;
    text-align: left !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--polarix-dark) !important;
}

.network-arrow {
    color: var(--polarix-gray) !important;
    transition: transform 0.3s ease !important;
}

.polarixpay-network-btn.active .network-arrow {
    transform: rotate(180deg) !important;
}

/* =================================================================
   NETWORK DROPDOWN
   ================================================================= */

.polarixpay-network-dropdown {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--polarix-white) !important;
    border: 2px solid var(--polarix-border) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 24px var(--polarix-shadow) !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-5px) !important;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s !important;
    z-index: 10 !important;
}

.polarixpay-network-dropdown.open {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

.network-option {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

.network-option:not(:last-child) {
    border-bottom: 1px solid var(--polarix-border) !important;
}

.network-option:hover:not(.disabled) {
    background: var(--polarix-light-gray) !important;
}

.network-option.disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

.network-option img {
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
}

.network-option span {
    flex: 1 !important;
    font-size: 13px !important;
    color: var(--polarix-dark) !important;
}

/* Ocultar checkmark completamente */
.checkmark,
.network-option .checkmark,
.network-option:not(.active) .checkmark {
    display: none !important;
}

/* =================================================================
   PAYMENT AREA
   ================================================================= */

.polarixpay-payment-area {
    display: block !important;
}

.polarixpay-payment-area.hidden {
    display: none !important;
}

/* =================================================================
   QR CODE - MÁS PEQUEÑO
   ================================================================= */

.polarixpay-qr {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 20px !important;
    background: var(--polarix-white) !important;
    border-radius: 14px !important;
    margin-bottom: 18px !important;
    min-height: 220px !important;
}

.polarixpay-qr canvas,
.polarixpay-qr img {
    max-width: 200px !important;
    max-height: 200px !important;
    width: 200px !important;
    height: 200px !important;
}

/* =================================================================
   ADDRESS SECTION - MÁS COMPACTA
   ================================================================= */

.polarixpay-address-section {
    margin-bottom: 18px !important;
}

.polarixpay-label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--polarix-gray) !important;
    margin-bottom: 6px !important;
    display: block !important;
}

.polarixpay-address-box {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 14px !important;
    background: var(--polarix-light-gray) !important;
    border-radius: 10px !important;
    border: 2px solid var(--polarix-border) !important;
}

.polarixpay-address {
    flex: 1 !important;
    font-size: 12px !important;
    font-family: 'Courier New', monospace !important;
    color: var(--polarix-dark) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.polarixpay-copy-btn {
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 4px !important;
    color: var(--polarix-gray) !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.polarixpay-copy-btn:hover {
    color: var(--polarix-orange) !important;
    transform: scale(1.1) !important;
}

.polarixpay-copy-btn:active {
    transform: scale(0.95) !important;
}

/* =================================================================
   AMOUNT - MÁS COMPACTO
   ================================================================= */

.polarixpay-amount {
    text-align: center !important;
    padding: 16px !important;
    background: linear-gradient(135deg, var(--polarix-orange), var(--polarix-orange-hover)) !important;
    border-radius: 10px !important;
    margin-bottom: 18px !important;
}

.amount-label {
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 2px !important;
}

.amount-value {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--polarix-white) !important;
    margin: 0 !important;
}

/* =================================================================
   VERIFY BUTTON - MÁS COMPACTO
   ================================================================= */

.polarixpay-verify-btn {
    width: 100% !important;
    padding: 14px !important;
    background: var(--polarix-dark) !important;
    color: var(--polarix-white) !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
    margin-bottom: 14px !important;
}

.polarixpay-verify-btn:hover {
    background: #2a2a2a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
}

.polarixpay-verify-btn:active {
    transform: translateY(0) !important;
}

.polarixpay-verify-btn.loading {
    pointer-events: none !important;
}

.polarixpay-verify-btn.loading .btn-text {
    opacity: 0 !important;
}

.btn-loader {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-top-color: var(--polarix-white) !important;
    border-radius: 50% !important;
    animation: spin 0.8s linear infinite !important;
    opacity: 0 !important;
}

.polarixpay-verify-btn.loading .btn-loader {
    opacity: 1 !important;
}

@keyframes spin {
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* =================================================================
   TIMER - MÁS COMPACTO
   ================================================================= */

.polarixpay-timer {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px !important;
    background: var(--polarix-light-gray) !important;
    border-radius: 8px !important;
    margin-bottom: 16px !important;
}

.polarixpay-timer svg {
    color: var(--polarix-orange) !important;
    width: 14px !important;
    height: 14px !important;
}

#timer-text {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--polarix-dark) !important;
}

.polarixpay-timer.warning {
    background: #fef3c7 !important;
}

.polarixpay-timer.warning svg,
.polarixpay-timer.warning #timer-text {
    color: #d97706 !important;
}

.polarixpay-timer.expired {
    background: #fee2e2 !important;
}

.polarixpay-timer.expired svg,
.polarixpay-timer.expired #timer-text {
    color: #dc2626 !important;
}

/* =================================================================
   TERMS - MÁS COMPACTO
   ================================================================= */

.polarixpay-terms {
    font-size: 11px !important;
    color: var(--polarix-gray) !important;
    text-align: center !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

.polarixpay-terms a {
    color: var(--polarix-orange) !important;
    text-decoration: none !important;
}

.polarixpay-terms a:hover {
    text-decoration: underline !important;
}

/* =================================================================
   SUCCESS STATE
   ================================================================= */

.polarixpay-success {
    text-align: center !important;
    padding: 40px 20px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 450px !important;
    /* Posicionamiento para ocupar todo el espacio del tab */
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: #fff !important;
    z-index: 100 !important;
}

.success-icon {
    margin-bottom: 20px !important;
    animation: scaleIn 0.5s ease !important;
}

.success-icon svg {
    width: 80px !important;
    height: 80px !important;
}

@keyframes scaleIn {
    from {
        transform: scale(0);
    }
    to {
        transform: scale(1);
    }
}

.success-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--polarix-success) !important;
    margin-bottom: 14px !important;
}

.success-order {
    font-size: 14px !important;
    color: var(--polarix-gray) !important;
    margin-bottom: 10px !important;
}

.success-order strong {
    color: var(--polarix-dark) !important;
}

.success-message {
    font-size: 13px !important;
    color: var(--polarix-gray) !important;
    line-height: 1.5 !important;
    margin-bottom: 8px !important;
}

.success-submessage {
    font-size: 13px !important;
    color: #9ca3af !important;
    line-height: 1.5 !important;
    margin-bottom: 24px !important;
    margin-top: 0 !important;
}

.success-btn {
    display: inline-block !important;
    padding: 12px 28px !important;
    background: var(--polarix-orange) !important;
    color: var(--polarix-white) !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.success-btn:hover {
    background: var(--polarix-orange-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

/* =================================================================
   TOAST NOTIFICATIONS
   ================================================================= */

/* Cartel de advertencia/notificación (arriba de tabs) */
.polarixpay-wrapper .woocommerce-info,
.polarixpay-wrapper .woocommerce-message,
.polarixpay-wrapper .woocommerce-error,
.polarixpay-wrapper .notice,
.polarixpay-wrapper .alert,
body:has(.polarixpay-wrapper) .woocommerce-info,
body:has(.polarixpay-wrapper) .woocommerce-message {
    padding: 10px 16px !important;
    margin: 0 0 12px 0 !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

.polarixpay-toast {
    position: fixed !important;
    top: 20px !important;
    right: 20px !important;
    padding: 14px 20px !important;
    background: var(--polarix-dark) !important;
    color: var(--polarix-white) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    z-index: 1000 !important;
    opacity: 0 !important;
    transform: translateX(400px) !important;
    transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55) !important;
}

.polarixpay-toast.show {
    opacity: 1 !important;
    transform: translateX(0) !important;
}

.polarixpay-toast.success {
    background: var(--polarix-success) !important;
}

.polarixpay-toast.error {
    background: #dc2626 !important;
}

.polarixpay-toast.warning {
    background: #f59e0b !important;
}

/* =================================================================
   RESPONSIVE
   ================================================================= */

@media (max-width: 640px) {
    .polarixpay-wrapper {
        padding: 15px !important;
        padding-bottom: 100px !important; /* Aumentado de 80px a 100px */
        min-height: 100vh !important;
    }
    
    .polarixpay-tabs {
        max-width: 100% !important;
    }
    
    .polarixpay-container {
        max-width: 100% !important;
        border-radius: 16px !important;
        margin-bottom: 20px !important;
    }
    
    .polarixpay-content {
        padding: 20px !important;
    }
    
    .polarixpay-title {
        font-size: 20px !important;
    }
    
    .polarixpay-qr {
        padding: 16px !important;
        min-height: 200px !important;
    }
    
    .polarixpay-qr canvas,
    .polarixpay-qr img {
        max-width: 180px !important;
        max-height: 180px !important;
        width: 180px !important;
        height: 180px !important;
    }
    
    .polarixpay-address {
        font-size: 11px !important;
    }
    
    .amount-value {
        font-size: 22px !important;
    }
    
    .polarixpay-toast {
        right: 10px !important;
        left: 10px !important;
        top: 10px !important;
    }
    
    /* Cartel de advertencia más compacto en mobile */
    .polarixpay-wrapper .woocommerce-info,
    .polarixpay-wrapper .woocommerce-message {
        padding: 8px 12px !important;
        font-size: 13px !important;
        margin-bottom: 10px !important;
    }
}

/* =================================================================
   PRINT STYLES
   ================================================================= */

@media print {
    .polarixpay-wrapper {
        background: white !important;
    }
    
    .polarixpay-verify-btn,
    .polarixpay-timer,
    .polarixpay-copy-btn,
    .polarixpay-tabs {
        display: none !important;
    }
}

/* =================================================================
   MOBILE - OCULTAR FOOTERS ESPECÍFICAMENTE
   ================================================================= */

@media (max-width: 768px) {
    /* Footer y barra inferior con selectores específicos */
    body footer,
    body .site-footer,
    body #colophon,
    footer:not(.polarixpay-footer),
    .footer:not(.polarixpay-footer),
    .site-footer,
    #colophon,
    .footer-wrapper,
    .mobile-navigation-bar,
    .bottom-navigation,
    .handheld-footer-bar,
    .storefront-handheld-footer-bar,
    #handheld-footer-bar,
    .mobile-bottom-bar,
    .sticky-bottom-bar,
    .em-navigation-bar,
    .ecomobile-mobile-navigation-bar,
    div[class*="mobile"][class*="navigation"],
    div[class*="bottom"][class*="navigation"],
    div[class*="footer"][class*="bar"],
    nav[class*="mobile"]:not(.woocommerce-breadcrumb),
    nav[class*="bottom"] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
        pointer-events: none !important;
    }
}

/* =================================================================
   PAYMENT CONFIRMATION (después de abrir app)
   ================================================================= */

.polarixpay-payment-confirmation {
    padding: 24px !important;
    text-align: center !important;
    background: var(--polarix-light-gray) !important;
    border-radius: 14px !important;
    margin-top: 20px !important;
}

.confirmation-message p {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--polarix-dark) !important;
    margin-bottom: 20px !important;
}

.polarixpay-confirm-btn {
    width: 100% !important;
    padding: 16px !important;
    background: var(--polarix-orange) !important;
    color: var(--polarix-white) !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin-bottom: 12px !important;
}

.polarixpay-confirm-btn:hover {
    background: var(--polarix-orange-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

.polarixpay-back-btn {
    width: 100% !important;
    padding: 14px !important;
    background: transparent !important;
    color: var(--polarix-gray) !important;
    border: 2px solid var(--polarix-border) !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.polarixpay-back-btn:hover {
    border-color: var(--polarix-gray) !important;
    color: var(--polarix-dark) !important;
}

/* =================================================================
   LOADING STATE - BOTÓN DE CONFIRMACIÓN
   ================================================================= */

.polarixpay-confirm-btn {
    position: relative !important;
    overflow: hidden !important;
}

.polarixpay-confirm-btn .btn-loader {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-top-color: var(--polarix-white) !important;
    border-radius: 50% !important;
    animation: spin 0.8s linear infinite !important;
    opacity: 0 !important;
}

.polarixpay-confirm-btn.loading .btn-loader {
    opacity: 1 !important;
}

.polarixpay-confirm-btn.loading {
    pointer-events: none !important;
}

/* =================================================================
   SUCCESS STATE MOBILE
   ================================================================= */

.polarixpay-success-mobile {
    text-align: center !important;
    padding: 32px 16px !important;
    animation: fadeIn 0.3s ease !important;
}

.polarixpay-success-mobile .success-icon {
    margin-bottom: 20px !important;
    animation: scaleIn 0.5s ease !important;
}

.polarixpay-success-mobile .success-icon svg {
    width: 60px !important;
    height: 60px !important;
}

.polarixpay-success-mobile .success-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--polarix-success) !important;
    margin-bottom: 14px !important;
}

.polarixpay-success-mobile .success-order {
    font-size: 14px !important;
    color: var(--polarix-gray) !important;
    margin-bottom: 10px !important;
}

.polarixpay-success-mobile .success-order strong {
    color: var(--polarix-dark) !important;
}

.polarixpay-success-mobile .success-message {
    font-size: 13px !important;
    color: var(--polarix-gray) !important;
    line-height: 1.5 !important;
    margin-bottom: 24px !important;
}

.polarixpay-success-mobile .success-btn {
    display: inline-block !important;
    padding: 12px 28px !important;
    background: var(--polarix-orange) !important;
    color: var(--polarix-white) !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.polarixpay-success-mobile .success-btn:hover {
    background: var(--polarix-orange-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

/* ===========================================================================
   POLARIXPAY v1.5.0 - ESTILOS ADICIONALES
   =========================================================================== */

/* =================================================================
   SUCCESS STATE - REEMPLAZA CONTENIDO PRINCIPAL
   ================================================================= */

.polarixpay-success-state {
    text-align: center !important;
    padding: 40px 24px !important;
    animation: fadeIn 0.5s ease !important;
}

/* Success state mobile - cuando está visible con display: flex */
#success-state-mobile {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

.polarixpay-success-state .success-icon {
    margin-bottom: 24px !important;
    animation: scaleIn 0.5s ease !important;
}

.polarixpay-success-state .success-icon svg {
    width: 80px !important;
    height: 80px !important;
}

.polarixpay-success-state .success-title {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--polarix-success) !important;
    margin-bottom: 12px !important;
}

.polarixpay-success-state .success-order-number {
    font-size: 14px !important;
    color: var(--polarix-gray) !important;
    margin-bottom: 24px !important;
    text-align: center !important;
}

.polarixpay-success-state .success-order-number strong {
    color: var(--polarix-dark) !important;
    font-weight: 600 !important;
}

/* Productos comprados */
.success-products {
    background: var(--polarix-light-gray) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-bottom: 24px !important;
    text-align: left !important;
}

.products-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--polarix-dark) !important;
    margin-bottom: 12px !important;
    text-align: left !important;
}

.products-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.products-list li {
    font-size: 14px !important;
    color: var(--polarix-dark) !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid var(--polarix-border) !important;
    text-align: left !important;
}

.products-list li:last-child {
    border-bottom: none !important;
}

/* Mensajes */
.polarixpay-success-state .success-message {
    font-size: 14px !important;
    color: var(--polarix-dark) !important;
    line-height: 1.5 !important;
    margin-bottom: 8px !important;
    text-align: center !important;
}

.polarixpay-success-state .success-submessage {
    font-size: 13px !important;
    color: var(--polarix-gray) !important;
    line-height: 1.4 !important;
    margin-bottom: 28px !important;
    text-align: center !important;
}

/* Botones */
.success-buttons {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.success-btn-track {
    display: block !important;
    width: 100% !important;
    padding: 14px !important;
    background: var(--polarix-dark) !important;
    color: var(--polarix-white) !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
}

.success-btn-track:hover {
    background: #2a2a2a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
}

.success-btn-shop {
    display: block !important;
    width: 100% !important;
    padding: 14px !important;
    background: var(--polarix-orange) !important;
    color: var(--polarix-white) !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
}

.success-btn-shop:hover {
    background: var(--polarix-orange-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

/* =================================================================
   PAYMENT DETAILS MOBILE
   ================================================================= */

.polarixpay-payment-details-mobile {
    padding: 20px 0 !important;
}

.payment-details-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--polarix-dark) !important;
    margin-bottom: 20px !important;
    text-align: center !important;
}

.payment-detail-section {
    margin-bottom: 16px !important;
}

.detail-label {
    display: block !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--polarix-gray) !important;
    margin-bottom: 6px !important;
}

.detail-select {
    width: 100% !important;
    padding: 12px 14px !important;
    background: var(--polarix-white) !important;
    border: 2px solid var(--polarix-border) !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    color: var(--polarix-dark) !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    appearance: none !important;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M1%201.5L6%206.5L11%201.5%22%20stroke%3D%22%236b7280%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22/%3E%3C/svg%3E') !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 40px !important;
}

.detail-select:focus {
    border-color: var(--polarix-orange) !important;
    outline: none !important;
}

.polarixpay-open-app-btn {
    width: 100% !important;
    padding: 14px !important;
    background: var(--polarix-orange) !important;
    color: var(--polarix-white) !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.polarixpay-open-app-btn:hover {
    background: var(--polarix-orange-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

/* =================================================================
   DESKTOP MESSAGE
   ================================================================= */

.polarixpay-desktop-message {
    text-align: center !important;
    padding: 40px 20px !important;
    background: var(--polarix-light-gray) !important;
    border-radius: 14px !important;
}

.desktop-message-icon {
    font-size: 48px !important;
    margin-bottom: 16px !important;
}

.desktop-message-text {
    font-size: 15px !important;
    color: var(--polarix-dark) !important;
    line-height: 1.6 !important;
    margin-bottom: 24px !important;
}

.desktop-message-text strong {
    color: var(--polarix-orange) !important;
}

.polarixpay-go-qr-btn {
    display: inline-block !important;
    padding: 14px 28px !important;
    background: var(--polarix-orange) !important;
    color: var(--polarix-white) !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.polarixpay-go-qr-btn:hover {
    background: var(--polarix-orange-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

/* =================================================================
   RESPONSIVE ADDITIONS
   ================================================================= */

@media (max-width: 640px) {
    .polarixpay-success-state {
        padding: 32px 16px !important;
    }
    
    .polarixpay-success-state .success-title {
        font-size: 24px !important;
    }
    
    .polarixpay-success-state .success-icon svg {
        width: 60px !important;
        height: 60px !important;
    }
    
    .success-products {
        padding: 16px !important;
    }
}

/* =================================================================
   ANIMATIONS
   ================================================================= */

@keyframes scaleIn {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* =================================================================
   PAGO RÁPIDO - ESTILOS v1.9.6
   ================================================================= */

/* Timer móvil */
.polarixpay-timer-mobile {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 16px !important;
    background: #fef3c7 !important;
    border-radius: 10px !important;
    color: #92400e !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.polarixpay-timer-mobile svg {
    color: #92400e !important;
    flex-shrink: 0 !important;
}

/* Success state móvil */
.polarixpay-success-state {
    display: none;
    text-align: center !important;
    padding: 40px 20px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 450px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: #fff !important;
    z-index: 100 !important;
}

/* Ocultar espacio en blanco debajo del grid */
#tab-web2 {
    position: relative !important;
    min-height: auto !important;
}

#tab-web2 #mobile-wallets-grid {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Payment details mobile - v1.9.6 */
.polarixpay-payment-details-mobile {
    padding: 0 !important;
    margin-top: 0 !important;
}

.polarixpay-payment-details-mobile .polarixpay-address-box {
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.polarixpay-payment-details-mobile .polarixpay-address {
    font-size: 12px !important;
    color: #374151 !important;
    word-break: break-all !important;
    font-family: monospace !important;
}

.polarixpay-payment-details-mobile .polarixpay-copy-btn {
    background: none !important;
    border: none !important;
    color: #6b7280 !important;
    cursor: pointer !important;
    padding: 8px !important;
    flex-shrink: 0 !important;
}

.polarixpay-payment-details-mobile .polarixpay-copy-btn:hover {
    color: #ff6b35 !important;
}

/* Open app button */
.polarixpay-open-app-btn {
    width: 100% !important;
    padding: 16px !important;
    background: #ff6b35 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.polarixpay-open-app-btn:hover {
    background: #e55a2b !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(255, 107, 53, 0.3) !important;
}

/* Verify button mobile */
#mobile-verify-btn {
    width: 100% !important;
    padding: 16px !important;
    background: #1f2937 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    margin-top: 10px !important;
}

#mobile-verify-btn:hover {
    background: #374151 !important;
}

#mobile-verify-btn.loading {
    pointer-events: none !important;
    opacity: 0.8 !important;
}

#mobile-verify-btn .btn-loader {
    display: none !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-top-color: #fff !important;
    border-radius: 50% !important;
    animation: spin 0.8s linear infinite !important;
    margin-left: 8px !important;
}

#mobile-verify-btn.loading .btn-loader {
    display: inline-block !important;
}

/* Back button mobile */
#back-to-wallets-mobile {
    width: 100% !important;
    padding: 14px !important;
    background: transparent !important;
    color: #6b7280 !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

#back-to-wallets-mobile:hover {
    color: #374151 !important;
    background: #f3f4f6 !important;
}

/* =================================================================
   FIN DE ESTILOS v1.9.6
   ================================================================= */
