/* Kreativa Checkout MD3 - Frontend Styles - MAXIMUM PRIORITY */

/* Force override all theme styles - MAXIMUM PRIORITY */
body.kreativa-custom-page,
body.kreativa-custom-page *,
body.kreativa-custom-page p,
body.kreativa-custom-page span,
body.kreativa-custom-page div,
body.kreativa-custom-page h1,
body.kreativa-custom-page h2,
body.kreativa-custom-page h3,
body.kreativa-custom-page h4,
body.kreativa-custom-page h5,
body.kreativa-custom-page h6,
body.kreativa-custom-page td,
body.kreativa-custom-page th,
body.kreativa-custom-page li,
body.kreativa-custom-page a,
body.kreativa-custom-page .woocommerce,
body.kreativa-custom-page .woocommerce * {
    font-family: 'Roboto', sans-serif !important;
}

/* Material Symbols Icons - CRITICAL - MUST BE FIRST */
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');

body.kreativa-custom-page .material-symbols-outlined,
.material-symbols-outlined {
    font-family: "Material Symbols Outlined" !important;
    font-weight: normal !important;
    font-style: normal !important;
    font-size: 24px !important;
    line-height: 1 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    display: inline-block !important;
    white-space: nowrap !important;
    word-wrap: normal !important;
    direction: ltr !important;
    -webkit-font-feature-settings: "liga" !important;
    -webkit-font-smoothing: antialiased !important;
    font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24 !important;
    speak: none !important;
    text-rendering: optimizeLegibility !important;
    -moz-osx-font-smoothing: grayscale !important;
}

:root {
    --kreativa-primary: #6750A4;
    --kreativa-primary-rgb: 103, 80, 164;
    --kreativa-surface: #fff;
    --kreativa-surface-variant: #f5f5f5;
    --kreativa-on-surface: #1a1a1a;
    --kreativa-on-surface-variant: #666;
    --kreativa-outline: #e0e0e0;
    --kreativa-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* ============================================================
   NUCLEAR: ZERO movement on ANY button/link-button, ANY state.
   This covers every possible theme class (.btn, .alt, .bordered,
   .wc-forward, .button, .checkout-button, .return-shop, etc.)
   ============================================================ */
body.kreativa-custom-page button,
body.kreativa-custom-page .button,
body.kreativa-custom-page .btn,
body.kreativa-custom-page a.button,
body.kreativa-custom-page a.btn,
body.kreativa-custom-page a.alt,
body.kreativa-custom-page a.checkout-button,
body.kreativa-custom-page a.return-shop,
body.kreativa-custom-page a.wc-forward,
body.kreativa-custom-page .wc-proceed-to-checkout a,
body.kreativa-custom-page input[type="submit"],
body.kreativa-custom-page input[type="button"],
body.kreativa-custom-page .kreativa-btn,
body.kreativa-custom-page .woocommerce a.button,
body.kreativa-custom-page .woocommerce button.button,
body.kreativa-custom-page .woocommerce a.button.alt,
body.kreativa-custom-page button:hover,
body.kreativa-custom-page .button:hover,
body.kreativa-custom-page .btn:hover,
body.kreativa-custom-page a.button:hover,
body.kreativa-custom-page a.btn:hover,
body.kreativa-custom-page a.alt:hover,
body.kreativa-custom-page a.checkout-button:hover,
body.kreativa-custom-page a.return-shop:hover,
body.kreativa-custom-page a.wc-forward:hover,
body.kreativa-custom-page .wc-proceed-to-checkout a:hover,
body.kreativa-custom-page input[type="submit"]:hover,
body.kreativa-custom-page input[type="button"]:hover,
body.kreativa-custom-page .kreativa-btn:hover,
body.kreativa-custom-page .woocommerce a.button:hover,
body.kreativa-custom-page .woocommerce button.button:hover,
body.kreativa-custom-page .woocommerce a.button.alt:hover,
body.kreativa-custom-page button:focus,
body.kreativa-custom-page .button:focus,
body.kreativa-custom-page .btn:focus,
body.kreativa-custom-page a.button:focus,
body.kreativa-custom-page a.btn:focus,
body.kreativa-custom-page .wc-proceed-to-checkout a:focus,
body.kreativa-custom-page button:active,
body.kreativa-custom-page .button:active,
body.kreativa-custom-page .btn:active,
body.kreativa-custom-page a.button:active,
body.kreativa-custom-page a.btn:active,
body.kreativa-custom-page .wc-proceed-to-checkout a:active {
    transform: none !important;
    -webkit-transform: none !important;
}

/* Full page override - HIGH SPECIFICITY */
body.kreativa-custom-page {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: clip !important;
    background: var(--kreativa-surface-variant) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-checkout,
body.kreativa-custom-page .kreativa-cart-page {
    font-family: 'Roboto', sans-serif !important;
    background: var(--kreativa-surface-variant) !important;
    min-height: 100vh !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.kreativa-custom-page #kreativa-page-wrapper {
    min-height: 100vh;
    width: 100%;
    display: block !important;
    visibility: visible !important;
}

body.kreativa-custom-page .kreativa-error {
    padding: 40px;
    text-align: center;
    color: var(--kreativa-on-surface-variant);
}


body.kreativa-checkout-drawer {
    overflow: hidden !important;
}

/* Additional specificity for all kreativa elements */
body.kreativa-custom-page .kreativa-cart-item,
body.kreativa-custom-page .kreativa-cart-item-image,
body.kreativa-custom-page .kreativa-cart-item-details,
body.kreativa-custom-page .kreativa-cart-item-price,
body.kreativa-custom-page .kreativa-cart-item-quantity,
body.kreativa-custom-page .kreativa-qty-btn,
body.kreativa-custom-page .kreativa-qty-value,
body.kreativa-custom-page .kreativa-order-summary-mini,
body.kreativa-custom-page .kreativa-summary-row {
    font-family: 'Roboto', sans-serif !important;
}

/* Common Card Styles - HIGH SPECIFICITY */
body.kreativa-custom-page .kreativa-card {
    background: var(--kreativa-surface) !important;
    border-radius: 16px !important;
    box-shadow: var(--kreativa-shadow) !important;
    overflow: hidden !important;
    margin-bottom: 24px !important;
}

body.kreativa-custom-page .kreativa-card-header {
    padding: 24px !important;
    border-bottom: 1px solid var(--kreativa-outline) !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

body.kreativa-custom-page .kreativa-cart-card-header {
    width: 100% !important;
    justify-content: space-between !important;
    gap: 0 !important;
}

body.kreativa-custom-page .kreativa-cart-header-title {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex: 0 0 auto !important;
}

body.kreativa-custom-page .kreativa-cart-header-actions {
    flex: 0 0 auto !important;
    margin-left: auto !important;
}

body.kreativa-custom-page .kreativa-card-header .material-symbols-outlined {
    color: var(--kreativa-primary) !important;
    font-size: 24px !important;
}

body.kreativa-custom-page .kreativa-card-header h2 {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-card-body {
    padding: 24px !important;
}

body.kreativa-custom-page .kreativa-card-footer {
    padding: 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}

/* Form Fields - HIGH SPECIFICITY - OVERRIDE ALL WOOCOMMERCE FORM ROWS */
body.kreativa-custom-page .woocommerce-form-row,
body.kreativa-custom-page .form-row,
body.kreativa-custom-page .kreativa-checkout .woocommerce-form-row,
body.kreativa-custom-page .kreativa-cart-page .woocommerce-form-row {
    margin-bottom: 20px !important;
    margin-top: 0 !important;
    font-family: 'Roboto', sans-serif !important;
}
body.kreativa-custom-page p.form-row {
    margin-bottom: 20px !important;
}

/* Labels inyectados por JS cuando el campo no tenía label por defecto */
body.kreativa-custom-page label.kreativa-injected-label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #666 !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-family: 'Roboto', sans-serif !important;
}

/* One-page: contacto siempre separado (evita email/teléfono pegados) */
body.kreativa-custom-page.kreativa-checkout-one-page .kreativa-section-content.active #billing_email_field,
body.kreativa-custom-page.kreativa-checkout-one-page .kreativa-section-content.active #billing_phone_field {
    width: 100% !important;
    float: none !important;
    clear: both !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    position: relative !important;
}

/* Mitad/ancho: dos columnas */
body.kreativa-custom-page .form-row.form-row-first,
body.kreativa-custom-page .form-row.form-row-last {
    width: calc(50% - 10px) !important;
    float: left !important;
    box-sizing: border-box !important;
    position: static !important;
    padding: 0 !important;
}
body.kreativa-custom-page .form-row.form-row-first {
    margin-right: 10px !important;
    margin-left: 0 !important;
}
body.kreativa-custom-page .form-row.form-row-last {
    margin-right: 0 !important;
    margin-left: 10px !important;
}
body.kreativa-custom-page .form-row.form-row-wide {
    width: 100% !important;
    clear: both !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Labels: flujo normal, sin absolute — así cualquier label inyectado es visible */
body.kreativa-custom-page .form-row label,
body.kreativa-custom-page .form-row.form-row-first label,
body.kreativa-custom-page .form-row.form-row-last label {
    position: static !important;
    display: block !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #666 !important;
    margin-bottom: 6px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-family: 'Roboto', sans-serif !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
}
/* Espacio antes de "(opcional)" */
body.kreativa-custom-page label .optional,
body.kreativa-custom-page label span.optional {
    margin-left: 4px !important;
}

/* WooCommerce oculta algunos labels con .hidden — dentro de nuestro checkout siempre visibles */
body.kreativa-custom-page .form-row label.hidden,
body.kreativa-custom-page .form-row label.screen-reader-text {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    width: auto !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: normal !important;
}
/* Wrapper interno de WooCommerce: debe ocupar todo el ancho del form-row sin desplazar nada */
body.kreativa-custom-page .form-row .woocommerce-input-wrapper {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}
/* Si no hay label, el espacio se respeta por el padding-top del row */
body.kreativa-custom-page .form-row.form-row-first .input-text,
body.kreativa-custom-page .form-row.form-row-first select,
body.kreativa-custom-page .form-row.form-row-first input[type="text"],
body.kreativa-custom-page .form-row.form-row-first input[type="email"],
body.kreativa-custom-page .form-row.form-row-first input[type="tel"],
body.kreativa-custom-page .form-row.form-row-last .input-text,
body.kreativa-custom-page .form-row.form-row-last select,
body.kreativa-custom-page .form-row.form-row-last input[type="text"],
body.kreativa-custom-page .form-row.form-row-last input[type="email"],
body.kreativa-custom-page .form-row.form-row-last input[type="tel"] {
    margin-top: 0 !important;
}
@media (max-width: 600px) {
    body.kreativa-custom-page .form-row.form-row-first,
    body.kreativa-custom-page .form-row.form-row-last {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
        padding-top: 0 !important;
        min-height: 0 !important;
    }
    body.kreativa-custom-page .form-row.form-row-first label,
    body.kreativa-custom-page .form-row.form-row-last label {
        position: static !important;
        margin-bottom: 8px !important;
    }
}

/* OVERRIDE ALL LABELS - WooCommerce and theme labels */
body.kreativa-custom-page label,
body.kreativa-custom-page .woocommerce label,
body.kreativa-custom-page .woocommerce-form-row label,
body.kreativa-custom-page .form-row label,
body.kreativa-custom-page .kreativa-checkout label,
body.kreativa-custom-page .kreativa-cart-page label,
body.kreativa-custom-page .kreativa-checkout .woocommerce-form-row label,
body.kreativa-custom-page .kreativa-cart-page .woocommerce-form-row label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface-variant) !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-family: 'Roboto', sans-serif !important;
}

/* OVERRIDE ALL INPUTS - WooCommerce and theme inputs */
body.kreativa-custom-page input[type="text"],
body.kreativa-custom-page input[type="email"],
body.kreativa-custom-page input[type="tel"],
body.kreativa-custom-page input[type="number"],
body.kreativa-custom-page input[type="password"],
body.kreativa-custom-page input[type="date"],
body.kreativa-custom-page select,
body.kreativa-custom-page textarea,
body.kreativa-custom-page .woocommerce input.input-text,
body.kreativa-custom-page .woocommerce select,
body.kreativa-custom-page .woocommerce textarea,
body.kreativa-custom-page .kreativa-checkout input[type="text"],
body.kreativa-custom-page .kreativa-checkout input[type="email"],
body.kreativa-custom-page .kreativa-checkout input[type="tel"],
body.kreativa-custom-page .kreativa-checkout input[type="number"],
body.kreativa-custom-page .kreativa-checkout input[type="password"],
body.kreativa-custom-page .kreativa-checkout select,
body.kreativa-custom-page .kreativa-checkout textarea,
body.kreativa-custom-page .kreativa-cart-page input[type="text"],
body.kreativa-custom-page .kreativa-cart-page input[type="email"],
body.kreativa-custom-page .kreativa-cart-page input[type="tel"],
body.kreativa-custom-page .kreativa-cart-page input[type="number"],
body.kreativa-custom-page .kreativa-cart-page select,
body.kreativa-custom-page .kreativa-cart-page textarea {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif !important;
    transition: all 0.2s !important;
    background: var(--kreativa-surface) !important;
    color: var(--kreativa-on-surface) !important;
    box-shadow: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Misma altura para inputs y selects (48px); excluir textarea */
body.kreativa-custom-page input[type="text"],
body.kreativa-custom-page input[type="email"],
body.kreativa-custom-page input[type="tel"],
body.kreativa-custom-page input[type="number"],
body.kreativa-custom-page input[type="password"],
body.kreativa-custom-page input[type="date"],
body.kreativa-custom-page select,
body.kreativa-custom-page .woocommerce input.input-text,
body.kreativa-custom-page .woocommerce select,
body.kreativa-custom-page .kreativa-checkout input[type="text"],
body.kreativa-custom-page .kreativa-checkout input[type="email"],
body.kreativa-custom-page .kreativa-checkout input[type="tel"],
body.kreativa-custom-page .kreativa-checkout input[type="number"],
body.kreativa-custom-page .kreativa-checkout input[type="password"],
body.kreativa-custom-page .kreativa-checkout select,
body.kreativa-custom-page .kreativa-cart-page input[type="text"],
body.kreativa-custom-page .kreativa-cart-page input[type="email"],
body.kreativa-custom-page .kreativa-cart-page input[type="tel"],
body.kreativa-custom-page .kreativa-cart-page input[type="number"],
body.kreativa-custom-page .kreativa-cart-page select {
    min-height: 48px !important;
}

/* Altura fija 48px solo en inputs de una línea (los select ya tienen min-height 48px) */
body.kreativa-custom-page input[type="text"],
body.kreativa-custom-page input[type="email"],
body.kreativa-custom-page input[type="tel"],
body.kreativa-custom-page input[type="number"],
body.kreativa-custom-page input[type="password"],
body.kreativa-custom-page input[type="date"],
body.kreativa-custom-page .woocommerce input.input-text[type="text"],
body.kreativa-custom-page .woocommerce input.input-text[type="email"],
body.kreativa-custom-page .woocommerce input.input-text[type="tel"],
body.kreativa-custom-page .woocommerce input.input-text[type="number"],
body.kreativa-custom-page .woocommerce input.input-text[type="password"],
body.kreativa-custom-page .kreativa-checkout input[type="text"],
body.kreativa-custom-page .kreativa-checkout input[type="email"],
body.kreativa-custom-page .kreativa-checkout input[type="tel"],
body.kreativa-custom-page .kreativa-checkout input[type="number"],
body.kreativa-custom-page .kreativa-checkout input[type="password"],
body.kreativa-custom-page .kreativa-cart-page input[type="text"],
body.kreativa-custom-page .kreativa-cart-page input[type="email"],
body.kreativa-custom-page .kreativa-cart-page input[type="tel"],
body.kreativa-custom-page .kreativa-cart-page input[type="number"] {
    height: 48px !important;
}

body.kreativa-custom-page .kreativa-checkout input:focus,
body.kreativa-custom-page .kreativa-checkout select:focus,
body.kreativa-custom-page .kreativa-checkout textarea:focus,
body.kreativa-custom-page .kreativa-cart-page input:focus,
body.kreativa-custom-page .kreativa-cart-page select:focus,
body.kreativa-custom-page .kreativa-cart-page textarea:focus {
    outline: none !important;
    border-color: var(--kreativa-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--kreativa-primary-rgb), 0.1) !important;
}

/* Buttons - HIGH SPECIFICITY - OVERRIDE ALL WOOCOMMERCE BUTTONS */
body.kreativa-custom-page button:not(.kreativa-btn):not(.material-symbols-outlined):not(.kreativa-qty-btn-minus):not(.kreativa-qty-btn-plus),
body.kreativa-custom-page .button:not(.kreativa-btn),
body.kreativa-custom-page input[type="submit"]:not(.kreativa-btn),
body.kreativa-custom-page input[type="button"]:not(.kreativa-btn),
body.kreativa-custom-page a.button:not(.kreativa-btn),
body.kreativa-custom-page .woocommerce button.button:not(.kreativa-btn),
body.kreativa-custom-page .woocommerce input.button:not(.kreativa-btn),
body.kreativa-custom-page .woocommerce a.button:not(.kreativa-btn) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 24px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    cursor: pointer !important;
    transition: background-color 0.2s, color 0.2s, opacity 0.2s !important;
    text-decoration: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    background: var(--kreativa-primary) !important;
    color: #fff !important;
    transform: none !important;
}

body.kreativa-custom-page .kreativa-btn,
body.kreativa-custom-page button.kreativa-btn,
body.kreativa-custom-page a.kreativa-btn,
body.kreativa-custom-page input.kreativa-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 24px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    cursor: pointer !important;
    transition: background-color 0.2s, color 0.2s, opacity 0.2s !important;
    text-decoration: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    transform: none !important;
}

body.kreativa-custom-page .kreativa-btn-primary,
body.kreativa-custom-page button.kreativa-btn-primary,
body.kreativa-custom-page a.kreativa-btn-primary,
body.kreativa-custom-page input.kreativa-btn-primary {
    background: var(--kreativa-primary) !important;
    color: #fff !important;
}

body.kreativa-custom-page .kreativa-btn-primary:hover,
body.kreativa-custom-page button.kreativa-btn-primary:hover,
body.kreativa-custom-page a.kreativa-btn-primary:hover,
body.kreativa-custom-page input.kreativa-btn-primary:hover {
    opacity: 0.88 !important;
    background: var(--kreativa-primary) !important;
    color: #fff !important;
    transform: none !important;
    box-shadow: none !important;
}

body.kreativa-custom-page .kreativa-btn-secondary,
body.kreativa-custom-page button.kreativa-btn-secondary,
body.kreativa-custom-page a.kreativa-btn-secondary,
body.kreativa-custom-page input.kreativa-btn-secondary {
    background: var(--kreativa-surface-variant) !important;
    color: var(--kreativa-on-surface) !important;
}

body.kreativa-custom-page .kreativa-btn-secondary:hover,
body.kreativa-custom-page button.kreativa-btn-secondary:hover,
body.kreativa-custom-page a.kreativa-btn-secondary:hover,
body.kreativa-custom-page input.kreativa-btn-secondary:hover {
    opacity: 0.88 !important;
    background: var(--kreativa-surface-variant) !important;
    color: var(--kreativa-on-surface) !important;
    transform: none !important;
    box-shadow: none !important;
}

body.kreativa-custom-page .kreativa-btn-block,
body.kreativa-custom-page button.kreativa-btn-block,
body.kreativa-custom-page a.kreativa-btn-block,
body.kreativa-custom-page input.kreativa-btn-block {
    width: 100% !important;
    display: flex !important;
}

/* REMOVED - replaced by nuclear rule at top of file */

/* POR PASOS TEMPLATE - Stepper en el medio del header, LARGO (ocupa todo el centro) */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 0 20px !important;
    width: 100% !important;
    min-width: 0 !important;
    position: relative !important;
    justify-self: stretch !important;
}

/* Barra horizontal de fondo (gris) */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper::before {
    content: '' !important;
    position: absolute !important;
    left: 20% !important;
    right: 20% !important;
    top: 20px !important;
    height: 2px !important;
    margin-top: -1px !important;
    background: var(--kreativa-outline) !important;
    z-index: -1 !important;
    pointer-events: none !important;
}

/* Segmento de línea entre este paso y el siguiente (solo hasta el borde de este paso; no invade el siguiente) */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-step:not(:last-child)::after {
    content: '' !important;
    position: absolute !important;
    top: 20px !important;
    left: 50% !important;
    width: 50% !important;
    height: 2px !important;
    margin-top: -1px !important;
    background: var(--kreativa-outline) !important;
    z-index: -1 !important;
    pointer-events: none !important;
}

/* Completado: barra llena hasta el borde del siguiente paso (solo cuando ya pasaste; no toca la animación del activo) */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-step.completed::after {
    width: 100% !important; /* desde centro del paso hasta el límite con el siguiente, sin invadirlo */
    background: var(--kreativa-primary) !important;
    animation: none !important;
    -webkit-animation: none !important;
    transform: scaleX(1) !important;
    opacity: 1 !important;
    transition: background 0.25s ease, width 0.25s ease !important;
}

/* Activo: solo la barra del paso actual se anima (pulso sutil) */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-step.active::after {
    background: var(--kreativa-primary) !important;
    transform-origin: left center !important;
    animation: kreativa-bar-grow 2.5s cubic-bezier(0.4, 0, 0.2, 1) infinite !important;
    -webkit-animation: kreativa-bar-grow 2.5s cubic-bezier(0.4, 0, 0.2, 1) infinite !important;
}

@keyframes kreativa-bar-grow {
    0%, 100% { transform: scaleX(0.4); opacity: 0.6; }
    50% { transform: scaleX(1); opacity: 1; }
}
@-webkit-keyframes kreativa-bar-grow {
    0%, 100% { -webkit-transform: scaleX(0.4); transform: scaleX(0.4); opacity: 0.6; }
    50% { -webkit-transform: scaleX(1); transform: scaleX(1); opacity: 1; }
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 1 !important;
    position: relative !important;
    z-index: 1 !important;
    min-width: 0 !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border-radius: 50% !important;
    background: var(--kreativa-surface-variant) !important;
    color: var(--kreativa-on-surface-variant) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    transition: background 0.2s, color 0.2s !important;
    position: relative !important;
    z-index: 1 !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-icon .material-symbols-outlined {
    font-size: 20px !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step.active .kreativa-step-icon {
    background: var(--kreativa-primary) !important;
    color: #fff !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step.completed .kreativa-step-icon {
    background: var(--kreativa-primary) !important;
    color: #fff !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-label {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface-variant) !important;
    font-family: 'Roboto', sans-serif !important;
    text-align: center !important;
    line-height: 1.2 !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-step.active .kreativa-step-label {
    color: var(--kreativa-primary) !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-content {
    display: grid !important;
    grid-template-columns: 1fr 400px !important;
    gap: 24px !important;
}

body.kreativa-custom-page .kreativa-step-content {
    display: none !important;
}

body.kreativa-custom-page .kreativa-step-content.active {
    display: block !important;
}

body.kreativa-custom-page .kreativa-checkout-actions {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 16px !important;
    margin-top: 32px !important;
    padding-top: 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}
/* Atrás a la izquierda, Continuar a la derecha */
body.kreativa-custom-page .kreativa-checkout-actions #prev-step {
    margin-right: auto !important;
}
body.kreativa-custom-page .kreativa-checkout-actions #next-step,
body.kreativa-custom-page .kreativa-checkout-actions #place_order {
    margin-left: auto !important;
}

/* En paso 2 (pago) y paso 3 no se muestra "Continuar", solo "Realizar pedido" */
body.kreativa-custom-page.kreativa-step-2 #next-step,
body.kreativa-custom-page.kreativa-step-3 #next-step {
    display: none !important;
}

/* ============================================================
   SELECTS NATIVOS — Flecha custom centrada + texto centrado
   Excluir selects que Select2 ya oculta (.select2-hidden-accessible)
   ============================================================ */
body.kreativa-custom-page select,
body.kreativa-custom-page .woocommerce select,
body.kreativa-custom-page .kreativa-checkout select,
body.kreativa-custom-page .kreativa-por-pasos select,
body.kreativa-custom-page .kreativa-por-pasos .woocommerce select,
body.kreativa-custom-page .kreativa-cart-page select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    padding: 0 40px 0 16px !important;
    height: 48px !important;
    line-height: 46px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z' fill='%23666'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 12px 8px !important;
    cursor: pointer !important;
    overflow: visible !important;
}

/* Evitar que la card corte el dropdown del select */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-card-body {
    overflow: visible !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-card {
    overflow: visible !important;
}

/* Paso 1: Envío y facturación - dos columnas (facturación | envío / otra dirección) */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-col2-set {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1.5rem 2rem !important;
    margin-bottom: 1.5rem !important;
}
@media (max-width: 768px) {
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-col2-set {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================================
   SELECT2 / SELECTWOO — Dropdown estilizado al diseño del plugin
   ============================================================ */

/* Select2/SelectWoo (si aplica en otros templates como one-page) */
body.kreativa-custom-page .select2-container {
    width: 100% !important;
}

body.kreativa-custom-page .select2-container .select2-selection--single {
    height: 48px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    background: var(--kreativa-surface) !important;
}

body.kreativa-custom-page .select2-container .select2-selection--single .select2-selection__rendered {
    color: var(--kreativa-on-surface) !important;
    line-height: 46px !important;
    padding-left: 16px !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 14px !important;
}

body.kreativa-custom-page .select2-container--focus .select2-selection--single,
body.kreativa-custom-page .select2-container--open .select2-selection--single {
    border-color: var(--kreativa-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--kreativa-primary-rgb), 0.1) !important;
}

body.kreativa-custom-page .select2-dropdown {
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    font-family: 'Roboto', sans-serif !important;
    z-index: 99999 !important;
}

/* ONE PAGE TEMPLATE - un solo bloque siempre abierto, pago en sidebar */

/* Header One Page: logo + título + Volver al carrito */
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-header {
    background: var(--kreativa-surface) !important;
    padding: 20px 32px !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 24px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-header-content {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    justify-self: start !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-back-cart {
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: var(--kreativa-primary) !important;
    text-decoration: none !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-back-cart:hover {
    opacity: 0.88 !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-logo-link {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    color: inherit !important;
    line-height: 0 !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-logo {
    height: 56px !important;
    width: auto !important;
    max-height: 56px !important;
    display: block !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-logo-icon {
    font-size: 44px !important;
    color: var(--kreativa-primary) !important;
}
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-title {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-content {
    display: grid !important;
    grid-template-columns: 1fr 400px !important;
    gap: 24px !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-section {
    background: var(--kreativa-surface) !important;
    border-radius: 16px !important;
    box-shadow: var(--kreativa-shadow) !important;
    margin-bottom: 16px !important;
    overflow: hidden !important;
}

/* Header sin cursor ni hover (no es clicable) */
body.kreativa-custom-page .kreativa-one-page .kreativa-section-header-static {
    padding: 20px 24px !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    cursor: default !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-section-number {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: var(--kreativa-primary) !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-section-header h2 {
    margin: 0 !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    flex: 1 !important;
    font-family: 'Roboto', sans-serif !important;
}

/* Contenido siempre visible con espacio arriba (header → contenido) */
body.kreativa-custom-page .kreativa-one-page .kreativa-section-content-visible {
    max-height: none !important;
    overflow: visible !important;
    padding: 28px 24px 32px 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}

/* Ocultar icono de toggle en one-page (no hay acordeón) */
body.kreativa-custom-page .kreativa-one-page .kreativa-toggle-icon {
    display: none !important;
}

/* Método de pago primero (antes del total) */
body.kreativa-custom-page .kreativa-one-page .kreativa-sidebar-payment {
    margin-bottom: 24px !important;
    padding-bottom: 24px !important;
    border-bottom: 1px solid var(--kreativa-outline) !important;
}

/* No mostrar el botón de WC dentro de la sección de pago; solo el nuestro debajo del total */
body.kreativa-custom-page .kreativa-one-page .kreativa-sidebar-payment #place_order,
body.kreativa-custom-page .kreativa-one-page .kreativa-sidebar-payment .button.alt[name="woocommerce_checkout_place_order"] {
    display: none !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-sidebar-total-and-button {
    margin-top: 24px !important;
    padding-top: 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}

/* Total como fila única (sin segunda tabla) */
body.kreativa-custom-page .kreativa-one-page .kreativa-order-total-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--kreativa-primary) !important;
    margin-bottom: 16px !important;
    padding: 12px 0 !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-order-total-amount {
    font-weight: 700 !important;
}

body.kreativa-custom-page .kreativa-one-page .kreativa-sidebar-place-order {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body.kreativa-custom-page .kreativa-one-page #place_order:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

/* Reglas legacy por si otro template usa .kreativa-section colapsable */
body.kreativa-custom-page .kreativa-section:not(.kreativa-section-always-open) .kreativa-section-header {
    padding: 20px 24px !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    cursor: pointer !important;
    transition: background 0.15s ease-out !important;
}

body.kreativa-custom-page .kreativa-section:not(.kreativa-section-always-open) .kreativa-section-content {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.2s ease-out !important;
}

body.kreativa-custom-page .kreativa-section:not(.kreativa-section-always-open) .kreativa-section-content.active {
    max-height: 2000px !important;
    padding: 20px 24px 24px 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}

/* ═══════════════════════════════════════════════════════
   DRAWER — Panel lateral: carrito mobile + one-page mobile
   ═══════════════════════════════════════════════════════ */

#kreativa-drawer-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 99998 !important;
    pointer-events: none !important;
    visibility: hidden !important;
    transition: visibility 0.18s ease !important;
}

#kreativa-drawer-wrapper.kreativa-drawer-is-open {
    pointer-events: auto !important;
    visibility: visible !important;
}

.kreativa-drawer-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0,0,0,0.38) !important;
    opacity: 0 !important;
    transition: opacity 0.22s cubic-bezier(0.32, 0.72, 0, 1) !important;
}

#kreativa-drawer-wrapper.kreativa-drawer-is-open .kreativa-drawer-overlay {
    opacity: 1 !important;
}

.kreativa-drawer-panel {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 440px !important;
    max-width: 100% !important;
    height: 100% !important;
    background: var(--kreativa-surface) !important;
    box-shadow: -6px 0 32px rgba(0,0,0,0.18) !important;
    transform: translateX(100%) !important;
    transition: transform 0.26s cubic-bezier(0.32, 0.72, 0, 1) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

@media (max-width: 480px) {
    .kreativa-drawer-panel {
        width: 100% !important;
    }
}

#kreativa-drawer-wrapper.kreativa-drawer-is-open .kreativa-drawer-panel {
    transform: translateX(0) !important;
}

.kreativa-drawer-panel-inner {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    min-height: 0 !important;
    padding: 0 12px 20px 12px !important;
}

/* ── Topbar: "Tu pedido" + X ─────────────────────────── */
.kreativa-drawer-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 16px 10px !important;
    border-bottom: 1px solid var(--kreativa-outline) !important;
    background: var(--kreativa-surface) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
}
.kreativa-drawer-topbar-title {
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}
.kreativa-drawer-close-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    color: var(--kreativa-on-surface-variant) !important;
    cursor: pointer !important;
    border-radius: 50% !important;
    transition: background 0.14s ease !important;
    flex-shrink: 0 !important;
}
.kreativa-drawer-close-btn:hover,
.kreativa-drawer-close-btn:focus {
    background: rgba(0,0,0,0.07) !important;
    color: var(--kreativa-on-surface) !important;
}
.kreativa-drawer-close-btn .material-symbols-outlined {
    font-size: 22px !important;
    line-height: 1 !important;
}

/* ── Section labels ──────────────────────────────────── */
.kreativa-drawer-section-label {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--kreativa-on-surface-variant) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    padding: 20px 16px 8px !important;
    font-family: 'Roboto', sans-serif !important;
}
.kreativa-drawer-section-label .material-symbols-outlined {
    font-size: 18px !important;
    color: var(--kreativa-primary) !important;
}

/* ── Loading spinner ─────────────────────────────────── */
.kreativa-drawer-loading {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 60px 24px !important;
    color: var(--kreativa-on-surface-variant) !important;
}
.kreativa-drawer-loading .material-symbols-outlined {
    font-size: 32px !important;
    color: var(--kreativa-primary) !important;
    animation: kreativa-spin 0.7s linear infinite !important;
}

@keyframes kreativa-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* ── Cart items en drawer: IDÉNTICO al carrito mobile ── */
.kreativa-drawer-cart-items {
    padding: 0 12px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-card {
    background: var(--kreativa-surface) !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 14px !important;
    padding: 12px !important;
    overflow: hidden !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-content {
    display: flex !important;
    gap: 12px !important;
    align-items: flex-start !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-image {
    width: 76px !important;
    min-width: 76px !important;
    height: 76px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    background: var(--kreativa-surface-variant) !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-details {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-name {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    line-height: 1.3 !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-name a {
    color: inherit !important;
    text-decoration: none !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-meta {
    font-size: 12px !important;
    color: var(--kreativa-on-surface-variant) !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-subtotal-mobile {
    display: block !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--kreativa-on-surface) !important;
    margin-top: 4px !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-quantity-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 8px !important;
    flex-wrap: wrap !important;
}
.kreativa-drawer-cart-items .kreativa-qty-row {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: var(--kreativa-surface-variant) !important;
}
.kreativa-drawer-cart-items .kreativa-qty-btn-minus,
.kreativa-drawer-cart-items .kreativa-qty-btn-plus {
    width: 32px !important;
    height: 32px !important;
    border: none !important;
    background: transparent !important;
    color: var(--kreativa-on-surface) !important;
    cursor: pointer !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.13s ease !important;
    font-family: 'Roboto', sans-serif !important;
}
.kreativa-drawer-cart-items .kreativa-qty-btn-minus:hover,
.kreativa-drawer-cart-items .kreativa-qty-btn-plus:hover {
    background: rgba(0,0,0,0.08) !important;
}
.kreativa-drawer-cart-items .kreativa-qty-value {
    min-width: 28px !important;
    text-align: center !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-unit-price {
    font-size: 12px !important;
    color: var(--kreativa-on-surface-variant) !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    flex-shrink: 0 !important;
    gap: 8px !important;
    min-height: 76px !important;
}
.kreativa-drawer-cart-items .kreativa-cart-item-subtotal {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--kreativa-on-surface) !important;
    white-space: nowrap !important;
}
.kreativa-drawer-remove-item {
    background: none !important;
    border: none !important;
    padding: 4px !important;
    cursor: pointer !important;
    color: var(--kreativa-on-surface-variant) !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    transition: color 0.13s ease, background 0.13s ease !important;
}
.kreativa-drawer-remove-item:hover {
    color: #dc3545 !important;
    background: rgba(220,53,69,0.08) !important;
}
.kreativa-drawer-remove-item .material-symbols-outlined {
    font-size: 20px !important;
}

/* ── Cupón en drawer ─────────────────────────────────── */
.kreativa-drawer-coupon {
    padding: 12px 12px 0 !important;
}
.kreativa-drawer-coupon-row {
    display: flex !important;
    gap: 8px !important;
}
.kreativa-drawer-coupon-input {
    flex: 1 !important;
    padding: 10px 12px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif !important;
    background: var(--kreativa-surface) !important;
    color: var(--kreativa-on-surface) !important;
}
.kreativa-drawer-coupon-input:focus {
    outline: none !important;
    border-color: var(--kreativa-primary) !important;
}

/* ── Checkout form dentro del drawer ─────────────────── */
.kreativa-drawer-checkout-form {
    padding: 0 12px !important;
}
.kreativa-drawer-fields .woocommerce-billing-fields,
.kreativa-drawer-fields .woocommerce-shipping-fields {
    margin: 0 !important;
}
.kreativa-drawer-fields .woocommerce-form-row,
.kreativa-drawer-checkout-form .woocommerce-form-row {
    margin-bottom: 12px !important;
}
.kreativa-drawer-checkout-form label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface-variant) !important;
    margin-bottom: 4px !important;
}
.kreativa-drawer-checkout-form input[type="text"],
.kreativa-drawer-checkout-form input[type="email"],
.kreativa-drawer-checkout-form input[type="tel"],
.kreativa-drawer-checkout-form select,
.kreativa-drawer-checkout-form textarea {
    width: 100% !important;
    padding: 11px 13px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-family: 'Roboto', sans-serif !important;
    background: var(--kreativa-surface) !important;
    color: var(--kreativa-on-surface) !important;
    box-sizing: border-box !important;
}
.kreativa-drawer-checkout-form input:focus,
.kreativa-drawer-checkout-form select:focus,
.kreativa-drawer-checkout-form textarea:focus {
    outline: none !important;
    border-color: var(--kreativa-primary) !important;
}

/* ── Totales en drawer ───────────────────────────────── */
.kreativa-drawer-totals {
    margin: 8px 12px 0 !important;
    background: var(--kreativa-surface-variant, rgba(0,0,0,0.03)) !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
}
.kreativa-drawer-total-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 5px 0 !important;
    font-size: 14px !important;
    color: var(--kreativa-on-surface-variant) !important;
    font-family: 'Roboto', sans-serif !important;
}
.kreativa-drawer-grand-total {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--kreativa-on-surface) !important;
    margin-top: 8px !important;
    padding-top: 10px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}
.kreativa-drawer-shipping-value .woocommerce-shipping-totals,
.kreativa-drawer-shipping-value p { font-size: 13px !important; margin: 0 !important; }

/* ── Pago en drawer ──────────────────────────────────── */
.kreativa-drawer-payment {
    padding: 0 12px !important;
    margin-top: 4px !important;
}
.kreativa-drawer-payment #place_order,
.kreativa-drawer-payment .button.alt[name="woocommerce_checkout_place_order"] {
    display: none !important;
}

/* ── Botón Realizar pedido ───────────────────────────── */
.kreativa-drawer-place-order {
    padding: 16px 12px 24px !important;
}
.kreativa-drawer-place-order #place_order {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 14px 20px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 12px !important;
    border: none !important;
    cursor: pointer !important;
}

.kreativa-cart-item {
    display: flex;
    gap: 16px;
    padding: 16px;
    background: var(--kreativa-surface-variant);
    border-radius: 12px;
    margin-bottom: 12px;
}

.kreativa-cart-item-image {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
}

.kreativa-cart-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kreativa-cart-item-details {
    flex: 1;
}

.kreativa-cart-item-details h3 {
    margin: 0 0 4px 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--kreativa-on-surface);
    font-family: 'Roboto', sans-serif;
}

.kreativa-cart-item-price {
    margin: 0;
    font-size: 14px;
    color: var(--kreativa-on-surface-variant);
}

.kreativa-cart-item-quantity {
    display: flex;
    align-items: center;
    gap: 12px;
}

.kreativa-qty-btn {
    width: 32px;
    height: 32px;
    border: 1px solid var(--kreativa-outline);
    background: var(--kreativa-surface);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--kreativa-on-surface);
    transition: all 0.2s;
    font-family: 'Roboto', sans-serif;
}

.kreativa-qty-btn:hover {
    background: var(--kreativa-surface-variant);
    border-color: var(--kreativa-primary);
}

.kreativa-qty-value {
    min-width: 24px;
    text-align: center;
    font-weight: 500;
}

.kreativa-drawer-footer {
    padding: 24px;
    border-top: 1px solid var(--kreativa-outline);
    background: var(--kreativa-surface);
}

.kreativa-order-summary-mini {
    margin-bottom: 16px;
}

.kreativa-summary-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 14px;
    color: var(--kreativa-on-surface-variant);
    font-family: 'Roboto', sans-serif;
}

.kreativa-summary-row.kreativa-total {
    font-size: 18px;
    font-weight: 500;
    color: var(--kreativa-on-surface);
    padding-top: 12px;
    border-top: 1px solid var(--kreativa-outline);
    margin-top: 8px;
}

/* Order Summary - HIGH SPECIFICITY - OVERRIDE ALL WOOCOMMERCE TABLES */
body.kreativa-custom-page table,
body.kreativa-custom-page .woocommerce table,
body.kreativa-custom-page .woocommerce-checkout-review-order-table,
body.kreativa-custom-page .kreativa-order-summary {
    font-family: 'Roboto', sans-serif !important;
    border-collapse: collapse !important;
}

body.kreativa-custom-page .kreativa-order-summary {
    position: relative !important;
}

body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table,
body.kreativa-custom-page .woocommerce-checkout-review-order-table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table th,
body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table td,
body.kreativa-custom-page .woocommerce-checkout-review-order-table th,
body.kreativa-custom-page .woocommerce-checkout-review-order-table td {
    padding: 12px 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
    border-bottom: 1px solid var(--kreativa-outline) !important;
    font-family: 'Roboto', sans-serif !important;
}

/* h3 de WooCommerce (billing/shipping/additional) — visibles y estilizados */
body.kreativa-custom-page .woocommerce-billing-fields > h3,
body.kreativa-custom-page .woocommerce-shipping-fields > h3:not(#ship-to-different-address),
body.kreativa-custom-page .woocommerce-additional-fields > h3 {
    display: block !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface, #1a1a1a) !important;
    font-family: 'Roboto', sans-serif !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
}

/* Clearfix: limpiar floats al final de TODOS los contenedores de campos */
body.kreativa-custom-page .woocommerce-billing-fields__field-wrapper::after,
body.kreativa-custom-page .woocommerce-shipping-fields .shipping_address::after,
body.kreativa-custom-page .woocommerce-additional-fields__field-wrapper::after,
body.kreativa-custom-page .kreativa-section-content::after,
body.kreativa-custom-page .kreativa-card-body::after {
    content: '' !important;
    display: table !important;
    clear: both !important;
}

/* Espacio entre grupos (billing -> shipping) */
body.kreativa-custom-page .woocommerce-shipping-fields {
    margin-top: 24px !important;
    clear: both !important;
}
body.kreativa-custom-page .woocommerce-additional-fields {
    margin-top: 24px !important;
    clear: both !important;
}

/* Columna derecha (sidebar): reset de márgenes y padding internos */
body.kreativa-custom-page .kreativa-checkout-sidebar .kreativa-card-body,
body.kreativa-custom-page .kreativa-checkout-sidebar .kreativa-card-header,
body.kreativa-custom-page .kreativa-checkout-sidebar .kreativa-card-footer {
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
}

/* Sidebar one-page: espacio entre header del card y contenido */
body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-sidebar .kreativa-card-body {
    padding-top: 24px !important;
}

body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table th,
body.kreativa-custom-page .woocommerce-checkout-review-order-table th {
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

/* Fila de envío: mismo alineado que Subtotal y Total. Anular cualquier regla de WooCommerce/tema. */
body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals.shipping td,
body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table tfoot tr.shipping td,
body.kreativa-custom-page .kreativa-order-summary table.woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals td {
    text-align: left !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ============================================================
   MÉTODOS DE ENVÍO — REESCRITURA COMPLETA (flexbox puro)
   ============================================================ */

/* UL contenedor */
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method,
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods,
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method,
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods {
    all: unset !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* LI tarjeta */
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method li,
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods li,
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method li,
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods li {
    all: unset !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    border: 1px solid var(--kreativa-outline) !important;
    background: var(--kreativa-surface) !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
    box-sizing: border-box !important;
}

body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method li:hover,
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods li:hover,
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method li:hover,
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods li:hover {
    border-color: rgba(var(--kreativa-primary-rgb), 0.5) !important;
}

/* Seleccionado */
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method li:has(input:checked),
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods li:has(input:checked),
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method li:has(input:checked),
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods li:has(input:checked) {
    background: rgba(var(--kreativa-primary-rgb), 0.08) !important;
    border-color: var(--kreativa-primary) !important;
}

/* RADIO — resetear todo y tamaño fijo 18×18 */
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method input[type="radio"],
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods input[type="radio"],
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method input[type="radio"],
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods input[type="radio"] {
    all: revert !important;
    -webkit-appearance: radio !important;
    appearance: radio !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    accent-color: var(--kreativa-primary) !important;
    cursor: pointer !important;
}

/* LABEL — ocupa resto del espacio, texto y precio en fila */
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method li label,
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods li label,
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method li label,
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods li label {
    all: unset !important;
    display: flex !important;
    flex: 1 1 0% !important;
    align-items: center !important;
    justify-content: space-between !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
    line-height: 1.4 !important;
}

/* Precio a la derecha */
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul#shipping_method li label .woocommerce-Price-amount,
body.kreativa-custom-page .woocommerce-checkout-review-order-table ul.woocommerce-shipping-methods li label .woocommerce-Price-amount,
body.kreativa-custom-page .kreativa-order-summary ul#shipping_method li label .woocommerce-Price-amount,
body.kreativa-custom-page .kreativa-order-summary ul.woocommerce-shipping-methods li label .woocommerce-Price-amount {
    margin-left: auto !important;
    flex-shrink: 0 !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
}

/* ============================================================
   "ENVIAR A UNA DIRECCIÓN DIFERENTE" — mismo estilo tarjeta
   ============================================================ */

/* Contenedor h3: convertir en tarjeta */
body.kreativa-custom-page #ship-to-different-address {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    border: 1px solid var(--kreativa-outline) !important;
    background: var(--kreativa-surface) !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
    box-sizing: border-box !important;
    margin-bottom: 16px !important;
    margin-top: 8px !important;
    clear: both !important;
    width: 100% !important;
}

body.kreativa-custom-page #ship-to-different-address:hover {
    border-color: rgba(var(--kreativa-primary-rgb), 0.5) !important;
}

body.kreativa-custom-page #ship-to-different-address:has(input:checked) {
    background: rgba(var(--kreativa-primary-rgb), 0.08) !important;
    border-color: var(--kreativa-primary) !important;
}

/* Label dentro */
body.kreativa-custom-page #ship-to-different-address label {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
    line-height: 1.4 !important;
    width: 100% !important;
}

/* Checkbox — mismo estilo que los radios de envío */
body.kreativa-custom-page #ship-to-different-address-checkbox {
    all: revert !important;
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    accent-color: var(--kreativa-primary) !important;
    cursor: pointer !important;
}

body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table .order-total,
body.kreativa-custom-page .woocommerce-checkout-review-order-table .order-total {
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--kreativa-primary) !important;
    font-family: 'Roboto', sans-serif !important;
}

/* Imágenes de productos en el resumen del pedido: bordes redondeados */
body.kreativa-custom-page .kreativa-order-summary .woocommerce-checkout-review-order-table img,
body.kreativa-custom-page .kreativa-order-summary img {
    border-radius: 12px !important;
}

body.kreativa-custom-page .kreativa-terms {
    margin-top: 16px !important;
    font-size: 12px !important;
    color: var(--kreativa-on-surface-variant) !important;
    text-align: center !important;
    font-family: 'Roboto', sans-serif !important;
}

/* Payment Methods - alineación izquierda y estado seleccionado visible */
body.kreativa-custom-page .kreativa-checkout .wc_payment_methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

body.kreativa-custom-page .kreativa-checkout .wc_payment_methods li {
    margin-bottom: 12px !important;
    padding: 16px !important;
    border: 2px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    transition: all 0.2s !important;
    background: var(--kreativa-surface) !important;
    text-align: left !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
}

body.kreativa-custom-page .kreativa-checkout .wc_payment_methods li label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    cursor: pointer !important;
    margin: 0 !important;
    order: 2 !important;
    flex: 1 1 auto !important;
}

body.kreativa-custom-page .kreativa-checkout .wc_payment_methods li input[type="radio"] {
    order: 1 !important;
}

body.kreativa-custom-page .kreativa-checkout .wc_payment_methods li .payment_box {
    width: 100% !important;
    flex: 1 1 100% !important;
    order: 3 !important;
    margin-top: 12px !important;
    padding-left: 0 !important;
}

body.kreativa-custom-page .kreativa-checkout .wc_payment_methods li:hover {
    border-color: var(--kreativa-primary) !important;
}

/* Método seleccionado: borde, fondo y anillo para que se vea claro */
body.kreativa-custom-page .kreativa-checkout .wc_payment_methods li:has(input[type="radio"]:checked) {
    border-color: var(--kreativa-primary) !important;
    background: rgba(var(--kreativa-primary-rgb, 103, 80, 164), 0.06) !important;
    box-shadow: 0 0 0 1px var(--kreativa-primary) !important;
}

/* Radio visible y clicable */
body.kreativa-custom-page .kreativa-checkout .wc_payment_methods input[type="radio"] {
    margin: 0 12px 0 0 !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    accent-color: var(--kreativa-primary) !important;
    -webkit-appearance: radio !important;
    appearance: radio !important;
}

/* Cart Page Styles - HIGH SPECIFICITY */
body.kreativa-custom-page .kreativa-cart-page {
    display: flex !important;
    flex-direction: column !important;
}

body.kreativa-custom-page .kreativa-cart-header {
    background: var(--kreativa-surface) !important;
    padding: 20px 32px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
}

body.kreativa-custom-page .kreativa-cart-header-content {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
}

body.kreativa-custom-page .kreativa-cart-logo-link {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    color: inherit !important;
    line-height: 0 !important;
}

body.kreativa-custom-page .kreativa-cart-logo {
    height: 56px !important;
    width: auto !important;
    max-height: 56px !important;
    display: block !important;
}

body.kreativa-custom-page .kreativa-cart-logo-icon {
    font-size: 44px !important;
    color: var(--kreativa-primary) !important;
}

body.kreativa-custom-page .kreativa-cart-title {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-continue {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: var(--kreativa-primary) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: opacity 0.2s !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-continue:hover {
    opacity: 0.88 !important;
}

/* Checkout (Por Pasos) header: una fila — logo | pasos LARGOS en el medio | volver al carrito */
body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-header {
    background: var(--kreativa-surface) !important;
    padding: 20px 32px !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 24px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-header-content {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    justify-self: start !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-back-cart {
    justify-self: end !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-logo-link {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    color: inherit !important;
    line-height: 0 !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-logo {
    height: 56px !important;
    width: auto !important;
    max-height: 56px !important;
    display: block !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-logo-icon {
    font-size: 44px !important;
    color: var(--kreativa-primary) !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-title {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-back-cart {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: var(--kreativa-primary) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: opacity 0.2s !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-back-cart:hover {
    opacity: 0.88 !important;
}

body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 32px 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

body.kreativa-custom-page .kreativa-cart-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 32px 24px !important;
    width: 100% !important;
}

body.kreativa-custom-page .kreativa-cart-content {
    display: grid !important;
    grid-template-columns: 1fr 400px !important;
    gap: 24px !important;
    align-items: start !important;
}

body.kreativa-custom-page .kreativa-cart-main {
    align-self: start !important;
    min-width: 0 !important;
}

body.kreativa-custom-page .kreativa-cart-main .kreativa-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body.kreativa-custom-page .kreativa-cart-sidebar,
body.kreativa-custom-page .kreativa-cart-sidebar .kreativa-card,
body.kreativa-custom-page .kreativa-cart-sidebar .cart_totals,
body.kreativa-custom-page .cart_totals {
    position: static !important;
    top: auto !important;
    align-self: start !important;
}

body.kreativa-custom-page .woocommerce-cart-form {
    overflow: visible !important;
}

/* Resumen del pedido: botones compactos y bien separados */
body.kreativa-custom-page .kreativa-cart-summary-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    margin-top: 24px !important;
    padding-top: 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
}

body.kreativa-custom-page .kreativa-cart-summary-actions .kreativa-btn-summary,
body.kreativa-custom-page .kreativa-cart-sidebar .wc-proceed-to-checkout a {
    padding: 10px 16px !important;
    min-height: 42px !important;
    height: auto !important;
    font-size: 14px !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    transition: background-color 0.2s, color 0.2s, opacity 0.2s !important;
}

body.kreativa-custom-page .kreativa-cart-sidebar .wc-proceed-to-checkout {
    margin: 0 !important;
    padding: 0 !important;
}

body.kreativa-custom-page .kreativa-cart-sidebar .wc-proceed-to-checkout a {
    background: var(--kreativa-primary) !important;
    color: #fff !important;
    border: none !important;
    width: 100% !important;
}

body.kreativa-custom-page .kreativa-cart-sidebar .wc-proceed-to-checkout a:hover,
body.kreativa-custom-page .kreativa-cart-summary-actions .kreativa-btn-summary:hover {
    opacity: 0.88 !important;
    transform: none !important;
    box-shadow: none !important;
}

body.kreativa-custom-page .kreativa-cart-summary-actions .kreativa-btn-secondary:hover {
    opacity: 0.88 !important;
}

/* Seguir comprando: botón negro en el resumen del carrito */
body.kreativa-custom-page .kreativa-cart-sidebar .kreativa-cart-summary-actions .kreativa-btn-secondary,
body.kreativa-custom-page .kreativa-cart-sidebar .kreativa-cart-summary-actions a.return-shop,
body.kreativa-custom-page .kreativa-cart-sidebar .wc-proceed-to-checkout a.return-shop {
    background: #1a1a1a !important;
    color: #fff !important;
}
body.kreativa-custom-page .kreativa-cart-sidebar .kreativa-cart-summary-actions .kreativa-btn-secondary:hover,
body.kreativa-custom-page .kreativa-cart-sidebar .kreativa-cart-summary-actions a.return-shop:hover,
body.kreativa-custom-page .kreativa-cart-sidebar .wc-proceed-to-checkout a.return-shop:hover {
    background: #333 !important;
    color: #fff !important;
    opacity: 1 !important;
}

/* Actualizar carrito: botón negro en la cabecera del carrito */
body.kreativa-custom-page .kreativa-cart-card-header .kreativa-cart-header-actions .kreativa-btn,
body.kreativa-custom-page .kreativa-cart-card-header .kreativa-cart-header-actions button[name="update_cart"] {
    background: #1a1a1a !important;
    color: #fff !important;
}
body.kreativa-custom-page .kreativa-cart-card-header .kreativa-cart-header-actions .kreativa-btn:hover,
body.kreativa-custom-page .kreativa-cart-card-header .kreativa-cart-header-actions button[name="update_cart"]:hover {
    background: #333 !important;
    color: #fff !important;
    opacity: 1 !important;
}

/* Empty cart state */
body.kreativa-custom-page .kreativa-cart-page-empty .kreativa-cart-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 60vh !important;
}

body.kreativa-custom-page .kreativa-cart-empty-state {
    text-align: center !important;
    padding: 48px 24px !important;
    max-width: 420px !important;
}

body.kreativa-custom-page .kreativa-cart-empty-icon {
    width: 96px !important;
    height: 96px !important;
    margin: 0 auto 24px !important;
    border-radius: 50% !important;
    background: rgba(var(--kreativa-primary-rgb, 103, 80, 164), 0.12) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.kreativa-custom-page .kreativa-cart-empty-icon .material-symbols-outlined {
    font-size: 48px !important;
    color: var(--kreativa-primary) !important;
}

body.kreativa-custom-page .kreativa-cart-empty-title {
    font-size: 22px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    margin: 0 0 12px !important;
}

body.kreativa-custom-page .kreativa-cart-empty-desc {
    font-size: 15px !important;
    color: var(--kreativa-on-surface-variant) !important;
    line-height: 1.5 !important;
    margin: 0 0 28px !important;
}

body.kreativa-custom-page .kreativa-cart-empty-cta {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 14px 28px !important;
    border-radius: 24px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    background: var(--kreativa-primary) !important;
    color: #fff !important;
    border: none !important;
    cursor: pointer !important;
    transition: opacity 0.2s !important;
}

body.kreativa-custom-page .kreativa-cart-empty-cta:hover {
    opacity: 0.88 !important;
    color: #fff !important;
}

/* Cart Items - HIGH SPECIFICITY */
body.kreativa-custom-page .kreativa-cart-items {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

body.kreativa-custom-page .kreativa-cart-item-card {
    background: var(--kreativa-surface) !important;
    border-radius: 16px !important;
    padding: 20px !important;
    box-shadow: var(--kreativa-shadow) !important;
    transition: all 0.2s !important;
}

body.kreativa-custom-page .kreativa-cart-item-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

body.kreativa-custom-page .kreativa-cart-item-content {
    display: flex !important;
    gap: 20px !important;
    position: relative !important;
}

/* Imagen del producto: siempre cuadrado 1:1 */
body.kreativa-custom-page .kreativa-cart-item-image {
    width: 120px !important;
    height: 120px !important;
    flex-shrink: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: var(--kreativa-surface-variant) !important;
    aspect-ratio: 1 / 1 !important;
}

body.kreativa-custom-page .kreativa-cart-item-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

body.kreativa-custom-page .kreativa-cart-item-details {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

body.kreativa-custom-page .kreativa-cart-item-name {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-item-name a {
    color: var(--kreativa-on-surface) !important;
    text-decoration: none !important;
}

body.kreativa-custom-page .kreativa-cart-item-name a:hover {
    color: var(--kreativa-primary) !important;
}

body.kreativa-custom-page .kreativa-cart-item-meta {
    font-size: 14px !important;
    color: var(--kreativa-on-surface-variant) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-item-subtotal-mobile {
    display: none !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--kreativa-primary) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-item-quantity-wrapper {
    margin-top: 12px !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

body.kreativa-custom-page .kreativa-cart-item-unit-price {
    font-size: 12px !important;
    color: var(--kreativa-on-surface-variant, #79747e) !important;
    font-family: 'Roboto', sans-serif !important;
}

/* Selector cantidad MD3: chip compacto, un solo bloque */
body.kreativa-custom-page .kreativa-qty-row {
    display: inline-flex !important;
    align-items: stretch !important;
    width: auto !important;
    max-width: none !important;
    height: 36px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    background: var(--kreativa-surface) !important;
    overflow: hidden !important;
    font-family: 'Roboto', sans-serif !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
}

body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-btn-minus,
body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-btn-plus {
    width: 36px !important;
    min-width: 36px !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--kreativa-primary) !important;
    font-size: 18px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s, color 0.2s !important;
    font-weight: 500 !important;
}

body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-btn-minus:hover,
body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-btn-plus:hover {
    background: rgba(var(--kreativa-primary-rgb), 0.08) !important;
    color: var(--kreativa-primary) !important;
}

/* Input de cantidad: compacto, misma altura que los botones +/- (no usar 48px del carrito) */
body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-num,
body.kreativa-custom-page .kreativa-cart-page .kreativa-qty-row input.kreativa-qty-num {
    width: 28px !important;
    min-width: 28px !important;
    max-width: 32px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    padding: 0 2px !important;
    margin: 0 !important;
    border: none !important;
    border-left: 1px solid var(--kreativa-outline) !important;
    border-right: 1px solid var(--kreativa-outline) !important;
    border-radius: 0 !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 36px !important;
    -moz-appearance: textfield !important;
    font-family: 'Roboto', sans-serif !important;
    background: var(--kreativa-surface) !important;
    color: var(--kreativa-on-surface) !important;
    box-sizing: border-box !important;
}

body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-num::-webkit-outer-spin-button,
body.kreativa-custom-page .kreativa-qty-row .kreativa-qty-num::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

body.kreativa-custom-page .kreativa-cart-item-quantity-wrapper .quantity {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

body.kreativa-custom-page .kreativa-cart-item-quantity-wrapper input[type="number"]:not(.kreativa-qty-num) {
    width: 80px !important;
    padding: 8px 12px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    text-align: center !important;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-item-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 8px !important;
    min-width: 120px !important;
}

body.kreativa-custom-page .kreativa-cart-item-price {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-item-subtotal {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--kreativa-primary) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-item-remove a {
    color: var(--kreativa-on-surface-variant) !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    transition: all 0.2s !important;
    margin-top: 8px !important;
}

body.kreativa-custom-page .kreativa-cart-item-remove a:hover {
    background: rgba(220, 53, 69, 0.12) !important;
    color: #dc3545 !important;
}

body.kreativa-custom-page .kreativa-cart-actions {
    margin-top: 24px !important;
    padding-top: 24px !important;
    border-top: 1px solid var(--kreativa-outline) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

body.kreativa-custom-page .kreativa-cart-actions .coupon {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

body.kreativa-custom-page .kreativa-cart-actions .coupon label {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-actions .coupon-input-group {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
}

/* Altura idéntica para input y botón del cupón */
body.kreativa-custom-page .kreativa-cart-actions .coupon input,
body.kreativa-custom-page .kreativa-cart-actions .coupon button {
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    box-sizing: border-box !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    border-radius: 8px !important;
}

body.kreativa-custom-page .kreativa-cart-actions .coupon input {
    flex: 1 !important;
    border: 1px solid var(--kreativa-outline) !important;
    font-family: 'Roboto', sans-serif !important;
}

body.kreativa-custom-page .kreativa-cart-actions .coupon button {
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #1a1a1a !important;
    color: #fff !important;
}
body.kreativa-custom-page .kreativa-cart-actions .coupon button:hover {
    background: #333 !important;
    color: #fff !important;
    opacity: 1 !important;
}

body.kreativa-custom-page .kreativa-checkout-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 32px 24px !important;
    width: 100% !important;
}

/* Toasts - reemplazo de alertas WP/WooCommerce */
#kreativa-toast-container,
body.kreativa-custom-page .kreativa-toast-container {
    position: fixed !important;
    bottom: 24px !important;
    right: 24px !important;
    left: auto !important;
    transform: none !important;
    z-index: 100000 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 10px !important;
    pointer-events: none !important;
    max-width: calc(100% - 48px) !important;
}

#kreativa-toast-container .kreativa-toast,
body.kreativa-custom-page .kreativa-toast {
    padding: 12px 18px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-family: 'Roboto', sans-serif !important;
    font-weight: 500 !important;
    box-shadow: 0 6px 24px rgba(0,0,0,0.18) !important;
    pointer-events: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    max-width: 280px !important;
    width: auto !important;
    animation: none !important;
}

#kreativa-toast-container .kreativa-toast-success,
body.kreativa-custom-page .kreativa-toast.kreativa-toast-success {
    background: #1a1a1a !important;
    color: #fff !important;
}

#kreativa-toast-container .kreativa-toast-error,
body.kreativa-custom-page .kreativa-toast.kreativa-toast-error {
    background: #dc3545 !important;
    color: #fff !important;
}

#kreativa-toast-container .kreativa-toast-info,
body.kreativa-custom-page .kreativa-toast.kreativa-toast-info {
    background: var(--kreativa-primary) !important;
    color: #fff !important;
}

/* Ocultar avisos nativos (se reemplazan por toasts en JS) */
body.kreativa-custom-page .woocommerce-notices-wrapper {
    opacity: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

/* ============================================================
   RESPONSIVE — Por Pasos
   Breakpoints:
     968px  tablet landscape  →  sidebar abajo, stepper compacto
     768px  tablet portrait   →  campos full width, header 2 filas
     480px  mobile            →  header apilado, stepper solo íconos
   ============================================================ */

/* --- TABLET LANDSCAPE (≤ 968px) --- */
@media (max-width: 968px) {

    /* Layout general: una columna, sidebar debajo del form */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-content {
        grid-template-columns: 1fr !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-sidebar {
        order: 2 !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-main {
        order: 1 !important;
    }

    /* Sidebar: resumen colapsado visualmente más compacto */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-sidebar .kreativa-card {
        margin-bottom: 0 !important;
    }

    /* Acciones: Atrás izquierda, Continuar derecha */
    body.kreativa-custom-page .kreativa-checkout-actions {
        flex-direction: row !important;
        justify-content: space-between !important;
    }

    body.kreativa-custom-page .kreativa-checkout-actions .kreativa-btn {
        flex: none !important;
    }

    /* Header: logo + título a la izq, back a la der, stepper abajo */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-header {
        grid-template-columns: 1fr auto !important;
        grid-template-rows: auto auto !important;
        grid-template-areas:
            "logo    back"
            "stepper stepper" !important;
        padding: 16px 20px 0 20px !important;
        gap: 0 !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-header-content {
        grid-area: logo !important;
        align-self: center !important;
        padding-bottom: 12px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-back-cart {
        grid-area: back !important;
        justify-self: end !important;
        align-self: center !important;
        padding-bottom: 12px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper {
        grid-area: stepper !important;
        width: 100% !important;
        padding: 14px 0 6px !important;
        border-top: 1px solid var(--kreativa-outline) !important;
        justify-content: space-between !important;
        /* barra de progreso unificada abajo de los iconos */
        position: relative !important;
    }

    /* En tablet+mobile: ocultar las líneas por-paso y usar una sola barra de progreso */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper::before {
        display: none !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-step::after {
        display: none !important;
    }

    /* Barra de progreso unificada — track gris */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper::after {
        content: '' !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        height: 3px !important;
        background: var(--kreativa-outline, #e0e0e0) !important;
        border-radius: 2px !important;
    }

    /* Progreso coloreado — ancho dinámico via data-active-step */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper[data-active-step="1"]::after {
        background: linear-gradient(to right, var(--kreativa-primary) 0%, var(--kreativa-primary) 33%, var(--kreativa-outline, #e0e0e0) 33%) !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper[data-active-step="2"]::after {
        background: linear-gradient(to right, var(--kreativa-primary) 0%, var(--kreativa-primary) 66%, var(--kreativa-outline, #e0e0e0) 66%) !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper[data-active-step="3"]::after {
        background: var(--kreativa-primary) !important;
    }

    /* Carrito: una sola columna */
    body.kreativa-custom-page .kreativa-cart-content {
        grid-template-columns: 1fr !important;
    }

    body.kreativa-custom-page .kreativa-cart-sidebar {
        position: relative !important;
        top: 0 !important;
    }
}

/* --- TABLET PORTRAIT (≤ 768px) --- */
@media (max-width: 768px) {

    /* Contenedor: menos padding lateral */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-container {
        padding: 20px 16px !important;
    }

    /* Campos de formulario: todos a ancho completo */
    body.kreativa-custom-page .form-row.form-row-first,
    body.kreativa-custom-page .form-row.form-row-last {
        width: 100% !important;
        float: none !important;
        clear: both !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    /* Cards: padding interno reducido */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-card-header {
        padding: 16px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-card-body {
        padding: 16px !important;
    }

    /* Header: logo más pequeño */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-logo {
        height: 40px !important;
        max-height: 40px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-logo-icon {
        font-size: 34px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-title {
        font-size: 17px !important;
    }

    /* Stepper: íconos más pequeños, labels visibles */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-icon {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-icon .material-symbols-outlined {
        font-size: 17px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-label {
        font-size: 11px !important;
    }

    /* One Page: header mismo tamaño logo/título en tablet */
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-header {
        padding: 16px 20px !important;
    }
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-logo {
        height: 40px !important;
        max-height: 40px !important;
    }
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-logo-icon {
        font-size: 34px !important;
    }
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-title {
        font-size: 17px !important;
    }

    /* Acciones: botones apilados en mobile-tablet */
    body.kreativa-custom-page .kreativa-checkout-actions {
        margin-top: 20px !important;
        padding-top: 16px !important;
    }

    /* Carrito: layout horizontal (imagen izq, detalles der) como desktop, compacto */
    body.kreativa-custom-page .kreativa-cart-container {
        padding: 24px 16px !important;
    }

    body.kreativa-custom-page .kreativa-cart-card-header {
        flex-wrap: wrap !important;
        gap: 12px !important;
        padding: 16px !important;
    }

    body.kreativa-custom-page .kreativa-cart-header-actions .kreativa-btn {
        width: 100% !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-card {
        padding: 12px !important;
        border-radius: 12px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-content {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }

    /* Imagen pequeña a la izquierda, 1:1 */
    body.kreativa-custom-page .kreativa-cart-item-image {
        width: 88px !important;
        min-width: 88px !important;
        height: 88px !important;
        min-height: 88px !important;
        flex-shrink: 0 !important;
        aspect-ratio: 1 / 1 !important;
        border-radius: 10px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-details {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        gap: 6px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-name {
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-subtotal-mobile {
        display: block !important;
        font-size: 15px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-quantity-wrapper {
        margin-top: 6px !important;
    }

    /* Acciones (subtotal + eliminar) en segunda fila, ancho completo */
    body.kreativa-custom-page .kreativa-cart-item-actions {
        flex: 1 1 100% !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        min-width: auto !important;
        margin-top: 0 !important;
        padding-top: 10px !important;
        border-top: 1px solid var(--kreativa-outline) !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-remove a {
        margin-top: 0 !important;
    }

    body.kreativa-custom-page .kreativa-cart-items {
        gap: 10px !important;
    }
}

/* --- MOBILE (≤ 480px) --- */
@media (max-width: 480px) {

    /* Header: stack vertical completo */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-header {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto auto !important;
        grid-template-areas:
            "logo"
            "stepper"
            "back" !important;
        padding: 14px 16px 0 16px !important;
        text-align: center !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-header-content {
        justify-content: center !important;
        padding-bottom: 0 !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-back-cart {
        justify-self: center !important;
        justify-content: center !important;
        font-size: 13px !important;
        padding: 10px 0 14px !important;
        border-top: 1px solid var(--kreativa-outline) !important;
        width: 100% !important;
    }

    /* One Page: header apilado en móvil (logo+título arriba, Volver al carrito abajo) */
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-header {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto !important;
        grid-template-areas:
            "logo"
            "back" !important;
        padding: 14px 16px 0 16px !important;
        text-align: center !important;
    }
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-header-content {
        grid-area: logo !important;
        justify-content: center !important;
        padding-bottom: 12px !important;
    }
    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-back-cart {
        grid-area: back !important;
        justify-self: center !important;
        justify-content: center !important;
        font-size: 13px !important;
        padding: 10px 0 14px !important;
        border-top: 1px solid var(--kreativa-outline) !important;
        width: 100% !important;
    }

    body.kreativa-custom-page .kreativa-one-page .kreativa-checkout-container {
        padding: 16px 12px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-stepper {
        padding: 14px 8px !important;
    }

    /* Stepper: solo ícono + label de 1 línea */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-step-label {
        font-size: 10px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 72px !important;
    }

    /* Contenedor: padding mínimo */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-checkout-container {
        padding: 16px 12px !important;
    }

    /* Cards */
    body.kreativa-custom-page .kreativa-por-pasos .kreativa-card-header {
        padding: 14px 12px !important;
        gap: 8px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-card-header h2 {
        font-size: 15px !important;
    }

    body.kreativa-custom-page .kreativa-por-pasos .kreativa-card-body {
        padding: 12px !important;
    }

    /* Acciones: botones apilados */
    body.kreativa-custom-page .kreativa-checkout-actions {
        flex-direction: column-reverse !important;
        gap: 10px !important;
    }

    body.kreativa-custom-page .kreativa-checkout-actions .kreativa-btn {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Inputs más cómodos en mobile */
    body.kreativa-custom-page input[type="text"],
    body.kreativa-custom-page input[type="email"],
    body.kreativa-custom-page input[type="tel"],
    body.kreativa-custom-page select,
    body.kreativa-custom-page textarea {
        font-size: 16px !important; /* evita zoom automático en iOS */
    }

    /* Carrito: cards más compactas en móvil */
    body.kreativa-custom-page .kreativa-cart-container {
        padding: 16px 12px !important;
    }

    body.kreativa-custom-page .kreativa-cart-header {
        padding: 16px 12px !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }

    body.kreativa-custom-page .kreativa-cart-title {
        font-size: 18px !important;
    }

    body.kreativa-custom-page .kreativa-cart-card-header {
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 14px 12px !important;
    }

    body.kreativa-custom-page .kreativa-cart-header-actions {
        margin-left: 0 !important;
    }

    body.kreativa-custom-page .kreativa-cart-header-actions .kreativa-btn {
        width: 100% !important;
        justify-content: center !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-card {
        padding: 10px !important;
        border-radius: 10px !important;
    }

    /* Mismo layout horizontal: imagen izq, detalles der (más compacto) */
    body.kreativa-custom-page .kreativa-cart-item-content {
        gap: 10px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-image {
        width: 72px !important;
        min-width: 72px !important;
        height: 72px !important;
        min-height: 72px !important;
        border-radius: 8px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-name {
        font-size: 14px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-subtotal-mobile {
        font-size: 14px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-quantity-wrapper {
        margin-top: 4px !important;
        gap: 6px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-subtotal,
    body.kreativa-custom-page .kreativa-cart-item-subtotal-mobile {
        font-size: 15px !important;
    }

    body.kreativa-custom-page .kreativa-cart-item-actions {
        padding-top: 8px !important;
    }

    body.kreativa-custom-page .kreativa-cart-items {
        gap: 8px !important;
    }

    body.kreativa-custom-page .kreativa-cart-actions {
        margin-top: 20px !important;
        padding-top: 20px !important;
    }
}

/* ================================================================
   DRAWER: Estilos de formulario scoped al wrapper del drawer.
   Replica body.kreativa-custom-page pero aplicado como clase local
   en .kreativa-drawer-content-wrap.kreativa-custom-page
   ================================================================ */

#kreativa-drawer-wrapper .kreativa-custom-page label,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce label,
#kreativa-drawer-wrapper .kreativa-custom-page .form-row label,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-form-row label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--kreativa-on-surface-variant) !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-family: 'Roboto', sans-serif !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page input[type="text"],
#kreativa-drawer-wrapper .kreativa-custom-page input[type="email"],
#kreativa-drawer-wrapper .kreativa-custom-page input[type="tel"],
#kreativa-drawer-wrapper .kreativa-custom-page input[type="number"],
#kreativa-drawer-wrapper .kreativa-custom-page input[type="password"],
#kreativa-drawer-wrapper .kreativa-custom-page input[type="date"],
#kreativa-drawer-wrapper .kreativa-custom-page select,
#kreativa-drawer-wrapper .kreativa-custom-page textarea,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce input.input-text,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce select {
    width: 100% !important;
    height: 48px !important;
    padding: 14px 16px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif !important;
    transition: all 0.2s !important;
    background: var(--kreativa-surface) !important;
    color: var(--kreativa-on-surface) !important;
    box-shadow: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    min-height: 48px !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page textarea {
    height: auto !important;
    min-height: 80px !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page input:focus,
#kreativa-drawer-wrapper .kreativa-custom-page select:focus,
#kreativa-drawer-wrapper .kreativa-custom-page textarea:focus {
    outline: none !important;
    border-color: var(--kreativa-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--kreativa-primary-rgb), 0.1) !important;
}

/* Select nativo: quitar apariencia del SO */
#kreativa-drawer-wrapper .kreativa-custom-page select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    padding-right: 40px !important;
}

/* Select2 dentro del drawer */
#kreativa-drawer-wrapper .kreativa-custom-page .select2-container {
    width: 100% !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .select2-container .select2-selection--single {
    height: 48px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    background: var(--kreativa-surface) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .select2-container .select2-selection--single .select2-selection__rendered {
    color: var(--kreativa-on-surface) !important;
    line-height: 46px !important;
    padding-left: 16px !important;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .select2-container .select2-selection--single .select2-selection__arrow {
    height: 46px !important;
    right: 10px !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .select2-container--focus .select2-selection--single,
#kreativa-drawer-wrapper .kreativa-custom-page .select2-container--open .select2-selection--single {
    border-color: var(--kreativa-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--kreativa-primary-rgb), 0.1) !important;
}

/* Form rows: full width en drawer (columna única) */
#kreativa-drawer-wrapper .kreativa-custom-page .form-row {
    float: none !important;
    width: 100% !important;
    margin-right: 0 !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .form-row.form-row-first,
#kreativa-drawer-wrapper .kreativa-custom-page .form-row.form-row-last {
    width: 100% !important;
    float: none !important;
    margin-right: 0 !important;
    clear: none !important;
}

/* Heading de sección (Datos de facturación, Datos de envío) */
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-billing-fields > h3,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-shipping-fields > h3:not(#ship-to-different-address),
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-additional-fields > h3 {
    display: block !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--kreativa-on-surface) !important;
    margin: 20px 0 14px 0 !important;
    padding: 0 !important;
    border: none !important;
    font-family: 'Roboto', sans-serif !important;
    letter-spacing: 0 !important;
}

/* Checkbox "Enviar a dirección diferente" */
#kreativa-drawer-wrapper .kreativa-custom-page #ship-to-different-address {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border: 1px solid var(--kreativa-outline) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    margin: 16px 0 !important;
    background: var(--kreativa-surface) !important;
    transition: all 0.2s !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #ship-to-different-address label {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    color: var(--kreativa-on-surface) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #ship-to-different-address-checkbox {
    all: revert !important;
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 18px !important;
    height: 18px !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    accent-color: var(--kreativa-primary) !important;
}

/* Errores de validación */
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-invalid input,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-invalid select,
#kreativa-drawer-wrapper .kreativa-custom-page .form-row.woocommerce-invalid input,
#kreativa-drawer-wrapper .kreativa-custom-page .form-row.woocommerce-invalid select {
    border-color: #e53935 !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-error,
#kreativa-drawer-wrapper .kreativa-custom-page .woocommerce-invalid-required-field,
#kreativa-drawer-wrapper .kreativa-custom-page .form-row .woocommerce-error {
    color: #e53935 !important;
    font-size: 12px !important;
    margin-top: 4px !important;
    display: block !important;
}

/* ── Botones dentro del drawer ─────────────────────────── */
#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 20px !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    cursor: pointer !important;
    transition: background-color 0.2s, opacity 0.2s !important;
    text-decoration: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-btn-primary {
    background: var(--kreativa-primary) !important;
    color: #fff !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-btn-primary:hover {
    opacity: 0.88 !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-btn-secondary {
    background: var(--kreativa-surface-variant) !important;
    color: var(--kreativa-on-surface) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-btn-secondary:hover {
    opacity: 0.82 !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-btn-block {
    width: 100% !important;
    padding: 16px 24px !important;
    font-size: 16px !important;
    border-radius: 10px !important;
}

/* Input del cupón: heredar altura del drawer input pero sin min-height (es flex con el botón) */
#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-coupon-input {
    height: 44px !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
}

/* ── Métodos de pago en drawer ─────────────────────────── */
#kreativa-drawer-wrapper .kreativa-custom-page #payment {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods,
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 16px 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li,
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods li {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 2px solid var(--kreativa-outline) !important;
    border-radius: 10px !important;
    background: var(--kreativa-surface) !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    transition: border-color 0.2s, background 0.2s !important;
    cursor: pointer !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li:hover,
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods li:hover {
    border-color: var(--kreativa-primary) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li:has(input[type="radio"]:checked),
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods li:has(input[type="radio"]:checked) {
    border-color: var(--kreativa-primary) !important;
    background: rgba(var(--kreativa-primary-rgb, 103, 80, 164), 0.06) !important;
    box-shadow: 0 0 0 1px var(--kreativa-primary) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li input[type="radio"],
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods li input[type="radio"] {
    all: revert !important;
    -webkit-appearance: radio !important;
    appearance: radio !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    order: 1 !important;
    cursor: pointer !important;
    accent-color: var(--kreativa-primary) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li label,
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods li label {
    all: unset !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    color: var(--kreativa-on-surface) !important;
    cursor: pointer !important;
    order: 2 !important;
    flex: 1 1 auto !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li label img,
#kreativa-drawer-wrapper .kreativa-custom-page #payment ul.payment_methods li label img {
    max-height: 24px !important;
    max-width: 80px !important;
    object-fit: contain !important;
    vertical-align: middle !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .payment_box,
#kreativa-drawer-wrapper .kreativa-custom-page #payment .wc_payment_methods li .payment_box {
    width: 100% !important;
    flex: 1 1 100% !important;
    order: 3 !important;
    margin-top: 12px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    font-size: 13px !important;
    color: var(--kreativa-on-surface-variant) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .payment_box p {
    margin: 0 0 8px 0 !important;
    font-size: 13px !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page #payment .payment_box input[type="text"],
#kreativa-drawer-wrapper .kreativa-custom-page #payment .payment_box input[type="password"],
#kreativa-drawer-wrapper .kreativa-custom-page #payment .payment_box input[type="tel"],
#kreativa-drawer-wrapper .kreativa-custom-page #payment .payment_box select {
    height: 44px !important;
    min-height: 44px !important;
}

/* Ocultar el botón de "Realizar pedido" que genera WC dentro de #payment */
#kreativa-drawer-wrapper #payment #place_order,
#kreativa-drawer-wrapper .woocommerce-checkout #payment > .form-row {
    display: none !important;
}

/* ── Métodos de envío en drawer ─────────────────────────── */
#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods {
    margin: 8px 0 16px 0 !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul.woocommerce-shipping-methods,
#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul#shipping_method {
    all: unset !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    list-style: none !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul li {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border-radius: 10px !important;
    border: 2px solid var(--kreativa-outline) !important;
    background: var(--kreativa-surface) !important;
    cursor: pointer !important;
    transition: border-color 0.2s, background 0.2s !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul li:hover {
    border-color: rgba(var(--kreativa-primary-rgb), 0.5) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul li:has(input:checked) {
    background: rgba(var(--kreativa-primary-rgb), 0.06) !important;
    border-color: var(--kreativa-primary) !important;
    box-shadow: 0 0 0 1px var(--kreativa-primary) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul li input[type="radio"] {
    all: revert !important;
    -webkit-appearance: radio !important;
    appearance: radio !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    accent-color: var(--kreativa-primary) !important;
}

#kreativa-drawer-wrapper .kreativa-custom-page .kreativa-drawer-shipping-methods ul li label {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex: 1 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    color: var(--kreativa-on-surface) !important;
    cursor: pointer !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Totals: loading state */
#kreativa-drawer-wrapper .kreativa-drawer-totals.is-loading {
    opacity: 0.5 !important;
    pointer-events: none !important;
    transition: opacity 0.15s !important;
}