/* WIN MANAGER - DASHBOARD v2 */
.wm-login-wrapper { display:flex; align-items:center; justify-content:center; min-height:60vh; padding:40px 20px; }
.wm-login-box { background:#fff; border-radius:20px; box-shadow:var(--wm-shadow-xl,0 20px 40px -10px rgba(0,0,0,0.12)); padding:40px; width:100%; max-width:420px; border:1px solid #E2E8F0; }
.wm-login-header { text-align:center; margin-bottom:30px; }
.wm-login-header h2 { font-size:24px; color:#1E293B; margin-bottom:8px; }
.wm-login-header p { color:#64748B; font-size:14px; }
.wm-login-form .wm-form-group { margin-bottom:20px; }
.wm-login-form label { display:block; margin-bottom:6px; font-size:14px; font-weight:600; color:#374151; }
.wm-login-form input[type="text"],.wm-login-form input[type="password"] { width:100%; padding:12px 16px; border:2px solid #E2E8F0; border-radius:10px; font-size:15px; outline:none; box-sizing:border-box; transition:all 0.3s; }
.wm-login-form input:focus { border-color:#2563EB; box-shadow:0 0 0 3px #DBEAFE; }

.wm-dashboard { max-width:1100px; margin:0 auto; padding:30px 20px; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
.wm-dash-header { display:flex; justify-content:space-between; align-items:center; padding:24px 30px; background:linear-gradient(135deg,#1E293B,#334155); border-radius:20px; color:#fff; margin-bottom:24px; flex-wrap:wrap; gap:16px; }
.wm-dash-header-info { display:flex; align-items:center; gap:16px; }
.wm-dash-logo { width:56px; height:56px; border-radius:14px; object-fit:cover; border:2px solid rgba(255,255,255,0.2); }
.wm-dash-header-info h2 { font-size:22px; margin:0; color:#fff; }
.wm-dash-subtitle { font-size:14px; opacity:0.7; margin:4px 0 0; }
.wm-dash-header-actions { display:flex; gap:10px; flex-wrap:wrap; }
.wm-dash-header-actions .wm-btn-outline { border-color:rgba(255,255,255,0.3); color:#fff; }
.wm-dash-header-actions .wm-btn-outline:hover { background:rgba(255,255,255,0.1); border-color:#fff; }
.wm-dash-header-actions .wm-btn-ghost { color:rgba(255,255,255,0.7); }

.wm-dash-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px; margin-bottom:24px; }
.wm-stat-card { background:#fff; border-radius:16px; padding:20px; text-align:center; box-shadow:0 1px 3px rgba(0,0,0,0.06); border:1px solid #E2E8F0; transition:all 0.3s; }
.wm-stat-card:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.08); }
.wm-stat-icon { font-size:24px; display:block; margin-bottom:6px; }
.wm-stat-number { display:block; font-size:28px; font-weight:800; color:var(--wm-primary,#2563EB); line-height:1; margin-bottom:4px; }
.wm-stat-label { font-size:12px; color:#64748B; font-weight:500; }

/* Chart */
.wm-chart { display:flex; align-items:flex-end; gap:6px; height:160px; padding:20px 0; }
.wm-chart-bar-wrap { flex:1; display:flex; flex-direction:column; align-items:center; height:100%; justify-content:flex-end; }
.wm-chart-bar { background:linear-gradient(180deg,var(--wm-primary,#2563EB),#3B82F6); border-radius:6px 6px 0 0; width:100%; min-height:4px; transition:height 0.6s ease; }
.wm-chart-bar-wrap:hover .wm-chart-bar { background:linear-gradient(180deg,var(--wm-primary-hover,#1D4ED8),var(--wm-primary,#2563EB)); }

/* Scheme picker */
.wm-scheme-picker{ display:flex; gap:12px; flex-wrap:wrap; margin-top:10px; }
.wm-scheme-option{ display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid #E2E8F0; border-radius:14px; background:#F8FAFC; cursor:pointer; user-select:none; transition:all 0.2s ease; }
.wm-scheme-option:hover{ border-color:rgba(30,64,175,0.35); transform:translateY(-1px); }
.wm-scheme-option input{ display:none; }
.wm-scheme-dot{
    /* El <span> es inline por defecto: sin display, width/height no aplican.
       Eso hacía que todos los colores se vieran casi iguales (como una línea).
       Lo volvemos un círculo real. */
    display:inline-block;
    flex:0 0 auto;
    width:26px;
    height:26px;
    border-radius:999px;
    border:2px solid rgba(255,255,255,0.9);
    box-shadow:0 6px 16px rgba(0,0,0,0.12);
}
.wm-scheme-original{ background:linear-gradient(135deg,#F8FAFC,#E2E8F0); }
/* Pastel palettes */
.wm-scheme-classic{ background:linear-gradient(135deg,#93C5FD,#A7F3D0); }
.wm-scheme-royal{ background:linear-gradient(135deg,#BFEFFF,#A5F3FC); }
.wm-scheme-onyx{ background:linear-gradient(135deg,#CBD5E1,#FDE68A); }
.wm-scheme-mint{ background:linear-gradient(135deg,#BBF7D0,#A7F3D0); }
.wm-scheme-peach{ background:linear-gradient(135deg,#FED7AA,#FECACA); }
.wm-scheme-lavender{ background:linear-gradient(135deg,#DDD6FE,#E9D5FF); }
.wm-scheme-sky{ background:linear-gradient(135deg,#BAE6FD,#CFFAFE); }
.wm-scheme-name{ font-size:13px; font-weight:700; color:#334155; }
.wm-scheme-option input:checked + .wm-scheme-dot{ outline:3px solid rgba(30,64,175,0.18); transform:scale(1.02); }
.wm-chart-label { font-size:10px; color:#94A3B8; margin-top:6px; }
.wm-chart-value { font-size:10px; color:#64748B; font-weight:600; margin-bottom:4px; }

/* Share */
.wm-share-buttons { display:flex; gap:10px; margin-top:16px; }
.wm-share-btn { flex:1; padding:10px; border-radius:10px; text-align:center; font-size:13px; font-weight:600; text-decoration:none; transition:all 0.3s; color:#fff; }
.wm-share-wa { background:#25D366; }
.wm-share-fb { background:#1877F2; }
.wm-share-tw { background:#1DA1F2; }
.wm-share-btn:hover { transform:translateY(-2px); opacity:0.9; color:#fff; text-decoration:none; }

.wm-dash-section { background:#fff; border-radius:20px; padding:28px; box-shadow:0 1px 3px rgba(0,0,0,0.06); border:1px solid #E2E8F0; margin-bottom:24px; }
.wm-dash-section-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; flex-wrap:wrap; gap:12px; }
.wm-dash-section-header h3 { font-size:20px; color:#1E293B; margin:0; }

.wm-products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.wm-product-card { background:#F8FAFC; border-radius:14px; overflow:hidden; border:1px solid #E2E8F0; transition:all 0.3s; }
.wm-product-card:hover { box-shadow:0 4px 12px rgba(0,0,0,0.06); transform:translateY(-2px); }
.wm-product-disabled { opacity:0.5; }
.wm-product-img { position:relative; width:100%; height:160px; background:#E2E8F0; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.wm-product-img img { width:100%; height:100%; object-fit:cover; }
.wm-product-no-img { font-size:40px; opacity:0.3; }
.wm-product-badge { position:absolute; top:8px; left:8px; padding:3px 10px; border-radius:20px; font-size:10px; font-weight:700; text-transform:uppercase; }
.wm-badge-producto { background:#DBEAFE; color:#1D4ED8; }
.wm-badge-servicio { background:#D1FAE5; color:#065F46; }
.wm-product-info { padding:14px; }
.wm-product-info h4 { font-size:15px; color:#1E293B; margin:0 0 4px; font-weight:700; }
.wm-product-desc { font-size:13px; color:#64748B; margin:0 0 8px; }
.wm-product-price { display:flex; align-items:center; gap:8px; }
.wm-product-actions { display:flex; gap:6px; padding:0 14px 14px; }
.wm-btn-edit { background:#EFF6FF; color:#2563EB; border:1px solid #BFDBFE; }
.wm-btn-toggle { background:#F0FDF4; color:#166534; border:1px solid #BBF7D0; }
.wm-btn-delete { background:#FEF2F2; color:#DC2626; border:1px solid #FECACA; }

/* Modal */
.wm-modal-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); backdrop-filter:blur(4px); z-index:99999; display:flex; align-items:center; justify-content:center; padding:20px; }
.wm-modal { background:#fff; border-radius:20px; width:100%; max-width:560px; max-height:90vh; overflow-y:auto; box-shadow:0 25px 50px -12px rgba(0,0,0,0.25); }
.wm-modal-sm { max-width:440px; }
.wm-modal-header { display:flex; justify-content:space-between; align-items:center; padding:24px 28px; border-bottom:1px solid #E2E8F0; }
.wm-modal-header h3 { font-size:18px; color:#1E293B; margin:0; }
.wm-modal-close { background:none; border:none; font-size:24px; color:#64748B; cursor:pointer; }
.wm-modal form { padding:24px 28px; }
.wm-form-row { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }
.wm-image-dropzone { position:relative; border:2px dashed #CBD5E1; border-radius:14px; padding:30px; text-align:center; cursor:pointer; transition:all 0.3s; background:#F8FAFC; min-height:100px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.wm-image-dropzone:hover { border-color:#2563EB; background:#EFF6FF; }
.wm-image-dropzone input[type="file"] { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.wm-dropzone-text { font-size:14px; color:#64748B; margin:0; }
.wm-image-preview img { max-width:200px; max-height:150px; border-radius:8px; margin-bottom:8px; }
.wm-modal-footer { display:flex; justify-content:flex-end; gap:10px; padding-top:16px; border-top:1px solid #E2E8F0; margin-top:8px; }

/* Toast */
.wm-toast { position:fixed; bottom:30px; right:30px; background:#1E293B; color:#fff; padding:14px 24px; border-radius:12px; font-size:14px; font-weight:500; z-index:999999; box-shadow:0 10px 25px rgba(0,0,0,0.2); animation:wmSlideIn 0.4s ease; }
.wm-toast-success { background:#059669; }
.wm-toast-error { background:#DC2626; }
@keyframes wmSlideIn { from { transform:translateY(20px); opacity:0; } to { transform:translateY(0); opacity:1; } }

@media (max-width:768px) {
    .wm-dash-header { flex-direction:column; align-items:flex-start; }
    .wm-dash-stats { grid-template-columns:repeat(2,1fr); }
    .wm-form-row { grid-template-columns:1fr; }
    .wm-products-grid { grid-template-columns:1fr; }
    .wm-share-buttons { flex-direction:column; }
}

/* === v4.4 — Membership cards (Club + Shop status en panel del negocio) === */
.wm-membership-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-bottom: 28px;
}

@media (max-width: 720px) {
    .wm-membership-cards { grid-template-columns: 1fr; }
}

.wm-membership-card {
    background: #fff;
    border: 2px solid #E2E8F0;
    border-radius: 18px;
    padding: 20px;
    transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
}
.wm-membership-card.wm-mem-active {
    border-color: #86EFAC;
    background: linear-gradient(135deg, #fff 0%, #F0FDF4 100%);
}
.wm-membership-card.wm-mem-expired {
    border-color: #FCA5A5;
    background: linear-gradient(135deg, #fff 0%, #FEF2F2 100%);
}
.wm-membership-card.wm-mem-inactive {
    border-color: #E2E8F0;
    background: #F8FAFC;
}

.wm-mem-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #F1F5F9;
}
.wm-mem-card-icon {
    font-size: 32px;
    line-height: 1;
    width: 48px;
    height: 48px;
    background: #fff;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
.wm-mem-card-title { flex: 1; min-width: 0; }
.wm-mem-card-title strong {
    display: block;
    font-size: 16px;
    color: #0F172A;
    line-height: 1.2;
    font-weight: 800;
}
.wm-mem-card-title small {
    display: block;
    font-size: 12px;
    color: #64748B;
    margin-top: 2px;
}

.wm-mem-card-body { font-size: 14px; }
.wm-mem-card-status {
    margin: 0 0 6px;
    color: #0F172A;
    font-size: 14px;
    font-weight: 600;
}
.wm-mem-card-status strong {
    font-size: 22px;
    color: #1E40AF;
    font-weight: 800;
}
.wm-mem-active .wm-mem-card-status strong { color: #16A34A; }
.wm-mem-card-detail {
    margin: 0 0 14px;
    color: #64748B;
    font-size: 13px;
    line-height: 1.5;
}

.wm-mem-card-body .wm-btn { margin-top: 4px; }

/* Shop plans grid in modal */
.wm-shop-plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}
.wm-shop-plan-mini {
    --plan-color: #1E40AF;
    background: #fff;
    border: 2px solid #E2E8F0;
    border-radius: 14px;
    padding: 18px 14px;
    text-align: center;
    transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}
.wm-shop-plan-mini:hover {
    border-color: var(--plan-color);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.06);
}
.wm-shop-plan-mini.wm-shop-plan-current {
    background: linear-gradient(135deg, #F0FDF4 0%, #fff 100%);
    border-color: #86EFAC;
}
.wm-shop-plan-mini-icon { font-size: 32px; line-height: 1; }
.wm-shop-plan-mini strong {
    font-size: 15px;
    color: #0F172A;
    font-weight: 800;
}
.wm-shop-plan-mini-price {
    font-size: 22px;
    font-weight: 800;
    color: var(--plan-color);
    line-height: 1;
}
.wm-shop-plan-mini-price small {
    font-size: 12px;
    color: #64748B;
    font-weight: 500;
}
.wm-shop-plan-mini > small {
    color: #64748B;
    font-size: 12px;
    line-height: 1.4;
    flex: 1;
}
.wm-shop-plan-mini .wm-btn { width: 100%; }


/* v4.5.5 — Soporte directo del desarrollador en panel */
.wm-dev-support-card{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,#0F172A,#1E3A8A);color:#fff;border-radius:20px;padding:18px 20px;margin-bottom:22px;box-shadow:0 18px 45px rgba(15,23,42,.22);border:1px solid rgba(255,255,255,.12);}
.wm-dev-support-icon{width:54px;height:54px;border-radius:16px;background:rgba(34,197,94,.18);display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;border:1px solid rgba(34,197,94,.35);}
.wm-dev-support-copy{flex:1;min-width:0;}
.wm-dev-support-copy strong{display:block;font-size:18px;font-weight:900;margin-bottom:4px;color:#fff;}
.wm-dev-support-copy span{display:block;font-size:13px;line-height:1.5;color:#DBEAFE;}
.wm-dev-support-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border-radius:14px;background:#22C55E;color:#fff!important;text-decoration:none!important;font-weight:900;font-size:13px;box-shadow:0 12px 26px rgba(34,197,94,.28);white-space:normal;text-align:center;max-width:260px;transition:transform .18s ease,background .18s ease;}
.wm-dev-support-btn:hover{transform:translateY(-2px);background:#16A34A;}
@media(max-width:760px){.wm-dev-support-card{flex-direction:column;align-items:flex-start;}.wm-dev-support-btn{width:100%;max-width:none;}}

/* v4.5.7 — Panel móvil ordenado + contacto desarrollador compacto */
.wm-dashboard,
.wm-dashboard *,
.wm-modal,
.wm-modal *,
.wm-vendor-panel,
.wm-vendor-panel *{
    box-sizing:border-box;
}
.wm-dashboard{
    width:100%;
    max-width:1100px;
    overflow-x:hidden;
}
.wm-dashboard a,
.wm-dashboard button,
.wm-dashboard input,
.wm-dashboard select,
.wm-dashboard textarea{
    max-width:100%;
}
.wm-dashboard h1,
.wm-dashboard h2,
.wm-dashboard h3,
.wm-dashboard h4,
.wm-dashboard p,
.wm-dashboard span,
.wm-dashboard small,
.wm-dashboard label{
    overflow-wrap:anywhere;
}
.wm-dev-support-card-compact{
    padding:14px 16px!important;
    border-radius:16px!important;
    margin-bottom:18px!important;
    background:linear-gradient(135deg,#F0FDF4,#EFF6FF)!important;
    color:#0F172A!important;
    border:1px solid #BBF7D0!important;
    box-shadow:0 12px 28px rgba(15,23,42,.08)!important;
}
.wm-dev-support-card-compact .wm-dev-support-icon{
    width:42px!important;
    height:42px!important;
    border-radius:14px!important;
    font-size:20px!important;
    background:#22C55E!important;
    color:#fff!important;
    border:none!important;
}
.wm-dev-support-card-compact .wm-dev-support-copy strong{
    color:#0F172A!important;
    font-size:15px!important;
    line-height:1.25!important;
}
.wm-dev-support-card-compact .wm-dev-support-copy span{
    color:#475569!important;
    font-size:12px!important;
    line-height:1.45!important;
}
.wm-dev-support-card-compact .wm-dev-support-btn{
    min-height:40px!important;
    padding:0 14px!important;
    border-radius:999px!important;
    font-size:12px!important;
    max-width:190px!important;
    white-space:normal!important;
    box-shadow:0 10px 22px rgba(34,197,94,.18)!important;
}

@media (max-width:760px){
    .wm-dashboard{padding:18px 12px!important;}
    .wm-dash-header{
        padding:18px!important;
        border-radius:16px!important;
        align-items:flex-start!important;
    }
    .wm-dash-header-info{
        width:100%;
        align-items:flex-start!important;
        gap:12px!important;
    }
    .wm-dash-header-info h2{font-size:18px!important;line-height:1.25!important;}
    .wm-dash-logo{width:46px!important;height:46px!important;border-radius:12px!important;flex:0 0 auto;}
    .wm-dash-header-actions{
        width:100%;
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:8px!important;
    }
    .wm-dash-header-actions .wm-btn,
    .wm-dash-header-actions a,
    .wm-dash-header-actions button{
        width:100%!important;
        white-space:normal!important;
        text-align:center!important;
        min-height:42px!important;
    }
    .wm-dash-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
    .wm-stat-card{padding:14px 10px!important;border-radius:14px!important;}
    .wm-stat-number{font-size:22px!important;}
    .wm-dev-support-card{
        flex-direction:column!important;
        align-items:flex-start!important;
        gap:10px!important;
    }
    .wm-dev-support-card-compact .wm-dev-support-btn{
        width:100%!important;
        max-width:none!important;
        padding:10px 14px!important;
    }
    .wm-dash-section{
        padding:18px 14px!important;
        border-radius:16px!important;
    }
    .wm-dash-section-header{
        align-items:flex-start!important;
        flex-direction:column!important;
    }
    .wm-dash-section-header .wm-btn,
    .wm-dash-section-header button,
    .wm-dash-section-header a{
        width:100%!important;
        white-space:normal!important;
    }
    .wm-membership-cards,
    .wm-products-grid,
    .wm-shop-plans-grid,
    .wm-payment-methods,
    .wm-admin-stats-grid{
        grid-template-columns:1fr!important;
    }
    .wm-product-actions{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:8px!important;
    }
    .wm-product-actions .wm-btn,
    .wm-product-actions button,
    .wm-product-actions a{
        width:100%!important;
        white-space:normal!important;
    }
    .wm-share-buttons,
    .wm-modal-footer{
        flex-direction:column!important;
        align-items:stretch!important;
    }
    .wm-share-btn,
    .wm-modal-footer .wm-btn,
    .wm-modal-footer button{
        width:100%!important;
        text-align:center!important;
        white-space:normal!important;
    }
    .wm-modal-overlay{
        padding:10px!important;
        align-items:flex-start!important;
        overflow-y:auto!important;
    }
    .wm-modal{
        width:100%!important;
        max-width:100%!important;
        margin:10px 0!important;
        border-radius:16px!important;
        max-height:calc(100vh - 20px)!important;
    }
    .wm-modal-header{
        padding:16px!important;
        align-items:flex-start!important;
        gap:10px!important;
    }
    .wm-modal form{padding:16px!important;}
    .wm-form-row{grid-template-columns:1fr!important;gap:10px!important;}
    .wm-image-dropzone{padding:20px 14px!important;}
    .wm-image-preview img{max-width:100%!important;height:auto!important;}
    .wm-table-wrap{width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
    .wm-table{min-width:640px!important;}
}
@media (max-width:420px){
    .wm-dash-stats{grid-template-columns:1fr!important;}
}
