/*
 * SoyKibai Mobile 1.0.0
 * Capa responsive global. No modifica lógica de negocio.
 */

html, body { max-width: 100%; }
body { overflow-x: hidden; }
img, video, iframe, svg { max-width: 100%; height: auto; }
input, select, textarea, button { max-width: 100%; }
* { box-sizing: border-box; }

/* Evitar que tablas y componentes externos rompan el viewport */
.sk-mobile-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
}
.sk-mobile-table-wrap > table { min-width: 680px; margin-bottom: 0 !important; }

/* Elementor / WordPress: protección global */
.elementor-section,
.elementor-container,
.elementor-widget,
.elementor-widget-container,
.e-con,
.e-con-inner {
    min-width: 0;
    max-width: 100%;
}
.elementor img { max-width: 100%; height: auto; }

/* Header: permitir que elementos respiren en pantallas pequeñas */
@media (max-width: 768px) {
    .elementor-location-header .e-con,
    .elementor-location-header .elementor-container {
        max-width: 100% !important;
    }
    .elementor-location-header input[type="search"],
    .elementor-location-header input[type="text"] {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* ========== KIBI COMPRAS ========== */
@media (max-width: 768px) {
    .skkc { margin-bottom: 18px !important; }
    .skkc-card { padding: 18px !important; border-radius: 18px !important; }
    .skkc-head { align-items: flex-start !important; gap: 11px !important; }
    .skkc-kibi { width: 44px !important; height: 44px !important; min-width: 44px !important; border-radius: 14px !important; }
    .skkc h2 { font-size: 23px !important; }
    .skkc-head p { font-size: 14px !important; }
    .skkc textarea { min-height: 104px !important; font-size: 16px !important; }
    .skkc-actions { display: grid !important; grid-template-columns: 1fr !important; }
    .skkc-submit { width: 100% !important; min-height: 48px !important; }
    .skkc-examples { gap: 7px !important; }
    .skkc-examples button { flex: 1 1 100% !important; text-align: left !important; }
    .skkc-budget { padding: 15px !important; }
    .skkc-budget-row { display: grid !important; grid-template-columns: 1fr !important; }
    .skkc-budget-input, .skkc-budget-go, .skkc-budget-any { width: 100% !important; min-width: 0 !important; min-height: 46px !important; }
    .skkc-results { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
    .skkc-product-body { padding: 10px !important; }
    .skkc-classic { text-align: center !important; flex-direction: column !important; }
}
@media (max-width: 430px) {
    .skkc-results { grid-template-columns: 1fr !important; }
}

/* ========== MARKETPLACE ========== */
@media (max-width: 768px) {
    .sk-marketplace { width: 100% !important; max-width: 100% !important; }
    .sk-marketplace .sk-filters,
    .sk-marketplace .sk-filter-form,
    .sk-marketplace .sk-results-head {
        width: 100% !important;
        max-width: 100% !important;
    }
    .sk-filter-form { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
    .sk-filter-form input,
    .sk-filter-form select,
    .sk-filter-form button,
    .sk-apply-filters,
    .sk-clear { width: 100% !important; min-height: 44px !important; }
    .sk-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 11px !important; }
    .sk-card { min-width: 0 !important; }
    .sk-card .sk-image { width: 100% !important; }
    .sk-category-list,
    .sk-subcategory-list,
    .sk-family-list {
        display: flex !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        padding-bottom: 7px !important;
        -webkit-overflow-scrolling: touch;
    }
    .sk-category-list > *,
    .sk-subcategory-list > *,
    .sk-family-list > * { flex: 0 0 auto !important; }
}
@media (max-width: 430px) {
    .sk-grid { grid-template-columns: 1fr !important; }
}

/* ========== FICHA PRODUCTO / SOYKIBAI UI / WOOCOMMERCE ========== */
@media (max-width: 768px) {
    .woocommerce div.product,
    .woocommerce-page div.product { max-width: 100% !important; }
    .woocommerce div.product div.images,
    .woocommerce div.product div.summary {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
    .woocommerce div.product div.summary { margin-top: 16px !important; }
    .woocommerce div.product form.cart { display: flex !important; flex-wrap: wrap !important; gap: 9px !important; }
    .woocommerce div.product form.cart .button { flex: 1 1 180px !important; min-height: 46px !important; }
    .skui-card-shell,
    .skui-summary-box,
    .skui-trust-row,
    .skui-single-seller { max-width: 100% !important; }
    .skui-trust-row { flex-wrap: wrap !important; }
    .skui-single-seller { align-items: flex-start !important; }
    .skui-vendor-line { flex-wrap: wrap !important; }
}

/* ========== CARRITO / LOGIN / CUENTA ========== */
@media (max-width: 768px) {
    .skb-cart-drawer {
        width: min(94vw, 420px) !important;
        max-width: 94vw !important;
    }
    .skb-modal, .skb-panel {
        width: calc(100vw - 24px) !important;
        max-width: 480px !important;
        max-height: calc(100vh - 30px) !important;
        overflow-y: auto !important;
        margin: 15px auto !important;
    }
    .skb-register-card, .skb-register-page { width: 100% !important; max-width: 100% !important; }
    .skb-register-grid, .skb-form-row { grid-template-columns: 1fr !important; }
    .skb-span-2 { grid-column: auto !important; }
    .skb-primary, .skb-secondary,
    .skb-primary-link, .skb-secondary-link { width: 100% !important; min-height: 46px !important; }
    .skb-account-dropdown {
        position: fixed !important;
        left: 12px !important;
        right: 12px !important;
        top: auto !important;
        width: auto !important;
        max-width: none !important;
    }
}

/* ========== CHECKOUT SOYKIBAI + PAYWAY ========== */
@media (max-width: 768px) {
    .skco-shell { width: 100% !important; max-width: 100% !important; padding: 0 10px !important; }
    .skco-header, .skco-card, .skco-review, .skco-confirm,
    .skco-final-summary, .skco-payment { max-width: 100% !important; }
    .skco-progress {
        overflow-x: auto !important;
        justify-content: flex-start !important;
        gap: 7px !important;
        padding-bottom: 7px !important;
        -webkit-overflow-scrolling: touch;
    }
    .skco-step { flex: 0 0 auto !important; min-width: 105px !important; }
    .skco-fields { grid-template-columns: 1fr !important; }
    .skco-inline-field { display: grid !important; grid-template-columns: 1fr !important; }
    .skco-actions { display: grid !important; grid-template-columns: 1fr !important; gap: 9px !important; }
    .skco-primary, .skco-secondary, .skco-place-order { width: 100% !important; min-height: 48px !important; }
    .skco-deliveries, .skco-pickup-options { grid-template-columns: 1fr !important; }
    .skco-payment input,
    .skco-payment select,
    .skco-payment textarea,
    #payment input,
    #payment select,
    #payment textarea {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 44px !important;
    }
    #payment .form-row,
    .woocommerce-checkout #payment .form-row {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
    #payment ul.payment_methods { padding: 10px !important; }
    #payment div.payment_box { padding: 12px !important; margin: 10px 0 !important; }
    .woocommerce-checkout-review-order-table,
    .shop_table { max-width: 100% !important; }
}

/* ========== PUBLICADOR IA / WIZARD ========== */
@media (max-width: 768px) {
    .skai-app, .skai-v4, .kibai-wizard-card, .kibai-template { width: 100% !important; max-width: 100% !important; }
    .skai-grid, .skai-subgrid,
    .kibai-grid, .kibai-type-grid, .kibai-radio-grid,
    .kibai-check-grid, .kibai-measure-grid,
    .kibai-preview-grid, .kibai-preview-layout {
        grid-template-columns: 1fr !important;
    }
    .skai-hero { padding: 18px !important; }
    .skai-hero-actions, .skai-actions-left, .skai-final-actions, .skai-success-actions,
    .kibai-actions, .kibai-step-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        gap: 9px !important;
    }
    .skai-btn, .kibai-btn { width: 100% !important; min-height: 46px !important; }
    .skai-dropzone, .kibai-upload-area { padding: 20px 14px !important; }
    .skai-previews { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .kibai-preview-thumbs { overflow-x: auto !important; flex-wrap: nowrap !important; }
    .kibai-ai-modal-dialog {
        width: calc(100vw - 24px) !important;
        max-height: calc(100vh - 30px) !important;
        overflow-y: auto !important;
    }
}
@media (max-width: 430px) {
    .skai-previews { grid-template-columns: 1fr !important; }
}

/* ========== PANEL SELLER EXPERIENCE ========== */
@media (max-width: 768px) {
    .skse-dashboard,
    .skse-setup-shell,
    .skse-card,
    .skse-orders-card,
    .skse-payout-card,
    .skse-seals-card { max-width: 100% !important; }
    .skse-dashboard-header,
    .skse-store-identity,
    .skse-store-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }
    .skse-dashboard-actions,
    .skse-store-actions,
    .skse-filter-actions,
    .skse-step-actions,
    .skse-onboarding-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        gap: 8px !important;
    }
    .skse-primary-btn, .skse-secondary-btn { width: 100% !important; min-height: 44px !important; }
    .skse-kpis,
    .skse-grid,
    .skse-quick-grid,
    .skse-seals-grid,
    .skse-setup-two,
    .skse-filter-grid {
        grid-template-columns: 1fr !important;
    }
    .skse-chart { overflow-x: auto !important; }
    .skse-store-nav {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 8px !important;
        padding-bottom: 7px !important;
    }
    .skse-store-nav > * { flex: 0 0 auto !important; }
    .skse-product-actions { flex-wrap: wrap !important; }
    .skse-product-actions > * { flex: 1 1 130px !important; }
}

/* ========== ORDERS / MENSAJES / LOGÍSTICA ========== */
@media (max-width: 768px) {
    .sko-wrap, .sko-order-card, .sko-ai-order, .sko-message-box, .sko-coordination { max-width: 100% !important; }
    .sko-hero, .sko-card-head, .sko-order-main, .sko-order-info,
    .sko-message-head, .sko-admin-hero {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .sko-stats, .sko-tools, .sko-vendor-grid, .sko-slot-grid,
    .sko-admin-stats, .sko-ai-fields {
        grid-template-columns: 1fr !important;
    }
    .sko-actions, .sko-ai-order-actions, .sko-admin-payout-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        gap: 8px !important;
    }
    .sko-btn { width: 100% !important; min-height: 44px !important; }
    .sko-timeline { overflow-x: auto !important; }
    .sko-message-compose textarea { min-height: 100px !important; }
}

/* ========== DOKAN FRONTEND ========== */
@media (max-width: 768px) {
    .dokan-dashboard-wrap { display: block !important; }
    .dokan-dashboard .dokan-dash-sidebar,
    .dokan-dashboard-wrap .dokan-dash-sidebar {
        width: 100% !important;
        float: none !important;
        margin: 0 0 12px !important;
        position: static !important;
    }
    .dokan-dashboard .dokan-dashboard-content,
    .dokan-dashboard-wrap .dokan-dashboard-content {
        width: 100% !important;
        float: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .dokan-dashboard-menu {
        display: flex !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch;
        gap: 4px !important;
        padding: 8px !important;
    }
    .dokan-dashboard-menu li {
        flex: 0 0 auto !important;
        border: 0 !important;
    }
    .dokan-dashboard-menu li a {
        padding: 10px 12px !important;
        border-radius: 10px !important;
        min-height: 42px !important;
    }
    .dokan-product-listing .dokan-product-listing-area,
    .dokan-orders-area,
    .dokan-withdraw-area { max-width: 100% !important; overflow: visible !important; }
    .dokan-form-horizontal .dokan-control-label,
    .dokan-form-horizontal .dokan-w3,
    .dokan-form-horizontal .dokan-w5,
    .dokan-form-horizontal .dokan-w6,
    .dokan-form-horizontal .dokan-w7,
    .dokan-form-horizontal .dokan-w8,
    .dokan-form-horizontal .dokan-w9 {
        float: none !important;
        width: 100% !important;
        margin-left: 0 !important;
    }
    .dokan-form-group input,
    .dokan-form-group select,
    .dokan-form-group textarea { width: 100% !important; max-width: 100% !important; }
    .dokan-btn { min-height: 42px !important; }
    .dokan-store-wrap { display: block !important; }
    .dokan-store-sidebar,
    .dokan-single-store .profile-frame .profile-info-box {
        width: 100% !important;
        float: none !important;
    }
    .dokan-store-products-ordeby,
    .dokan-store-products-filter-area { width: 100% !important; float: none !important; }
    .dokan-store-tabs ul {
        display: flex !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .dokan-store-tabs ul li { flex: 0 0 auto !important; }
}

/* ========== TABLAS WOOCOMMERCE/DOKAN ========== */
@media (max-width: 768px) {
    table.dokan-table,
    table.shop_table,
    .woocommerce-orders-table,
    .skse-order-table { font-size: 13px !important; }
    table.dokan-table th, table.dokan-table td,
    table.shop_table th, table.shop_table td,
    .skse-order-table th, .skse-order-table td { padding: 8px !important; }
}

/* ========== BOTONES Y FORMULARIOS: TOUCH TARGETS ========== */
@media (max-width: 768px) {
    button, .button, input[type="submit"], input[type="button"],
    a.elementor-button, .dokan-btn {
        min-height: 42px;
    }
    input[type="text"], input[type="email"], input[type="tel"], input[type="number"],
    input[type="password"], input[type="search"], select, textarea {
        font-size: 16px !important; /* evita zoom automático de iOS */
    }
}

/* 360-430px: compactación extra */
@media (max-width: 430px) {
    body { font-size: 15px; }
    h1 { font-size: clamp(25px,8vw,34px) !important; }
    h2 { font-size: clamp(21px,7vw,29px) !important; }
    h3 { font-size: clamp(18px,6vw,24px) !important; }
    .elementor-widget-container { max-width: 100% !important; }
}

/* Respeto de safe area en iPhone */
@supports (padding: max(0px)) {
    @media (max-width: 768px) {
        .skb-cart-drawer,
        .skb-modal,
        .skco-shell {
            padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
        }
    }
}

/* v1.0.1 - fixes reales de móvil */
@media(max-width:768px){
  footer,.site-footer,.elementor-location-footer{max-width:100%!important;overflow-x:hidden!important}
  .elementor-location-footer .e-con,.elementor-location-footer .elementor-container,.elementor-location-footer .elementor-section,.footer-widgets,.site-footer .container{display:grid!important;grid-template-columns:1fr!important;width:100%!important;max-width:100%!important;gap:14px!important;padding-left:14px!important;padding-right:14px!important}
  .elementor-location-footer .elementor-column,.elementor-location-footer .e-child,.footer-widgets>*{width:100%!important;max-width:100%!important;margin:0!important}

  .skb-modal,.skb-panel,.skb-login-modal,.skb-register-modal,.skb-modal-content,.skb-auth-card,.skb-login-card{
    width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important;left:12px!important;right:12px!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important;overflow-x:hidden!important
  }
  .skb-modal *,.skb-panel *,.skb-login-modal *,.skb-register-modal *{max-width:100%!important;box-sizing:border-box!important}
  .skb-modal input,.skb-panel input,.skb-login-modal input,.skb-register-modal input,.skb-modal button,.skb-panel button{width:100%!important;max-width:100%!important}

  .skb-cart-drawer,.skb-cart-panel,.skb-cart-sheet{
    left:auto!important;right:0!important;width:min(96vw,430px)!important;max-width:96vw!important;min-width:0!important;overflow-x:hidden!important
  }
  .skb-cart-drawer *,.skb-cart-panel *,.skb-cart-sheet *{max-width:100%!important;box-sizing:border-box!important}
  .skb-cart-summary,.skb-cart-footer,.skb-cart-total,.skb-cart-actions{width:100%!important;max-width:100%!important;padding-left:14px!important;padding-right:14px!important}
  .skb-cart-total,.skb-cart-subtotal{display:flex!important;justify-content:space-between!important;gap:12px!important;flex-wrap:wrap!important}
  .skb-cart-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .skb-cart-actions a,.skb-cart-actions button{width:100%!important;min-width:0!important}

  .skco-review table,.skco-final-summary table,.woocommerce-checkout-review-order-table{width:100%!important;table-layout:fixed!important}
  .skco-review th,.skco-review td,.skco-final-summary th,.skco-final-summary td,.woocommerce-checkout-review-order-table th,.woocommerce-checkout-review-order-table td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important}
  .skco-final-summary,.skco-review,.woocommerce-checkout-review-order{overflow-x:hidden!important}
}


/* ===== v1.0.2 · HEADER MÓVIL COMPACTO ===== */
@media (max-width: 600px) {

  /* Reducir al mínimo los espacios internos del header de Elementor */
  .elementor-location-header .elementor-section,
  .elementor-location-header .elementor-container,
  .elementor-location-header .e-con,
  .elementor-location-header .e-con-inner {
    min-height: 0 !important;
  }

  .elementor-location-header .elementor-widget {
    margin-bottom: 0 !important;
  }

  /* Logo compacto */
  .elementor-location-header .elementor-widget-image img,
  .elementor-location-header img.custom-logo,
  .elementor-location-header .site-logo img {
    width: auto !important;
    max-width: 145px !important;
    max-height: 82px !important;
    object-fit: contain !important;
  }

  /* Barra morada: menos padding y menos separación */
  .elementor-location-header [style*="background"],
  .elementor-location-header .elementor-section,
  .elementor-location-header .e-con {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
  }

  /* Buscador del header más bajo */
  .elementor-location-header input[type="search"],
  .elementor-location-header input[type="text"] {
    min-height: 46px !important;
    height: 46px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    border-radius: 14px !important;
  }

  .elementor-location-header form[role="search"],
  .elementor-location-header .search-form,
  .elementor-location-header .elementor-search-form,
  .elementor-location-header .woocommerce-product-search {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* Botón de usuario / iniciar sesión compacto */
  .elementor-location-header a,
  .elementor-location-header button {
    min-height: 38px !important;
  }

  .elementor-location-header .skb-account-trigger,
  .elementor-location-header .skb-login-trigger,
  .elementor-location-header .skb-account-button {
    min-height: 38px !important;
    padding: 6px 10px !important;
    width: auto !important;
  }

  /* La franja de redes puede conservarse pero mucho más baja */
  .elementor-location-header .elementor-icon-list-items,
  .elementor-location-header .elementor-social-icons-wrapper {
    min-height: 0 !important;
    line-height: 1 !important;
  }

  .elementor-location-header .elementor-social-icon,
  .elementor-location-header .elementor-icon-list-icon {
    font-size: 19px !important;
  }

  /* Evitar cualquier ancho fijo que genere sensación de cabecera gigante */
  .elementor-location-header,
  .elementor-location-header > *,
  .elementor-location-header .elementor-element {
    max-width: 100% !important;
  }
}

/* En celulares muy angostos compactamos todavía más */
@media (max-width: 430px) {
  .elementor-location-header .elementor-widget-image img,
  .elementor-location-header img.custom-logo,
  .elementor-location-header .site-logo img {
    max-width: 125px !important;
    max-height: 70px !important;
  }

  .elementor-location-header input[type="search"],
  .elementor-location-header input[type="text"] {
    min-height: 44px !important;
    height: 44px !important;
  }
}


/* ===== v1.0.3 · RECONSTRUCCIÓN HEADER MÓVIL ===== */
@media (max-width: 600px) {
  .elementor-location-header .elementor-section,
  .elementor-location-header .elementor-container,
  .elementor-location-header .e-con,
  .elementor-location-header .e-con-inner,
  .elementor-location-header .elementor-widget-wrap,
  .elementor-location-header .elementor-column-wrap {
    min-height: 0 !important;
  }

  .elementor-location-header .elementor-icon-list-text,
  .elementor-location-header .elementor-widget-icon-list .elementor-icon-list-text {
    display: none !important;
  }

  .elementor-location-header .elementor-widget-social-icons,
  .elementor-location-header .elementor-widget-icon-list {
    margin: 0 !important;
    padding: 0 !important;
  }

  .elementor-location-header .elementor-widget-image,
  .elementor-location-header .elementor-widget-theme-site-logo,
  .elementor-location-header .site-logo,
  .elementor-location-header .custom-logo-link {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .elementor-location-header .elementor-widget-image img,
  .elementor-location-header img.custom-logo,
  .elementor-location-header .site-logo img {
    display: block !important;
    margin: 0 auto !important;
    max-width: 150px !important;
    width: 150px !important;
    max-height: 76px !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .elementor-location-header .elementor-search-form,
  .elementor-location-header .woocommerce-product-search,
  .elementor-location-header .search-form {
    width: calc(100% - 28px) !important;
    max-width: 420px !important;
    margin: 4px auto !important;
  }

  .elementor-location-header input[type="search"],
  .elementor-location-header input[type="text"] {
    min-height: 42px !important;
    height: 42px !important;
    padding: 7px 12px !important;
    font-size: 15px !important;
  }

  .elementor-location-header .skb-account-trigger,
  .elementor-location-header .skb-login-trigger,
  .elementor-location-header .skb-account-button,
  .elementor-location-header [class*="account"],
  .elementor-location-header [class*="login"] {
    min-height: 34px !important;
    height: auto !important;
    padding: 4px 8px !important;
    margin: 4px auto 0 !important;
    width: auto !important;
    max-width: 90% !important;
  }

  .elementor-location-header .elementor-widget-wrap,
  .elementor-location-header .elementor-column-wrap,
  .elementor-location-header .e-con-inner {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  .elementor-location-header .elementor-spacer,
  .elementor-location-header .elementor-widget-spacer {
    display: none !important;
  }

  .elementor-location-header [style*="min-height"],
  .elementor-location-header [style*="height:"] {
    min-height: 0 !important;
  }
}

@media (max-width: 430px) {
  .elementor-location-header .elementor-widget-image img,
  .elementor-location-header img.custom-logo,
  .elementor-location-header .site-logo img {
    max-width: 145px !important;
    width: 145px !important;
    max-height: 72px !important;
  }

  .elementor-location-header .elementor-search-form,
  .elementor-location-header .woocommerce-product-search,
  .elementor-location-header .search-form {
    width: calc(100% - 24px) !important;
  }

  .elementor-location-header input[type="search"],
  .elementor-location-header input[type="text"] {
    height: 40px !important;
    min-height: 40px !important;
  }
}