/* ===========================================================
   panel.css — sistema de paneles para profile / security / venture
   Clases con prefijo .pp- (scoped). Tema oscuro + acento verde,
   fiel a los bocetos. No pisa estilos globales.
   =========================================================== */

/* Tokens mapeados a las variables de tema del sitio (flipean solas con [data-theme=dark]) */
.pp-wrap {
    --pp-green: var(--color-primary, #22c55e);
    --pp-strong: var(--text-primary, #0f172a);
    --pp-ink: var(--text-primary, #334155);
    --pp-mut: var(--text-secondary, #6b7280);
    --pp-mut2: var(--text-secondary, #94a3b8);
    --pp-card: var(--color-surface, #ffffff);
    --pp-line: var(--border-color, rgba(0,0,0,.10));
    --pp-input: var(--color-background, #f3f4f6);
    color: var(--pp-ink);
}

/* ---- Encabezado de página ---- */
.pp-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:22px; flex-wrap:wrap; }
.pp-head h1 { margin:0 0 4px; font-size:1.9rem; font-weight:800; color:var(--pp-strong); letter-spacing:-.02em; border:none; }
.pp-head p { margin:0; color:var(--pp-mut); font-size:.95rem; }

/* ---- Banner superior (bienvenida / seguridad) ---- */
.pp-banner { position:relative; display:flex; align-items:center; gap:18px; padding:22px 26px; margin-bottom:22px; overflow:hidden;
    background:linear-gradient(120deg, rgba(34,197,94,.12), rgba(34,197,94,.02)); border:1px solid rgba(34,197,94,.22); border-radius:18px; }
.pp-banner-ico { width:64px; height:64px; flex:none; border-radius:50%; display:grid; place-items:center; font-size:28px;
    background:rgba(34,197,94,.14); border:1px solid rgba(34,197,94,.3); color:var(--pp-green); overflow:hidden; }
.pp-banner-ico img { width:100%; height:100%; object-fit:cover; }
.pp-banner h3 { margin:0 0 4px; color:var(--pp-green); font-size:1.15rem; font-weight:700; }
.pp-banner p { margin:0; color:var(--pp-mut); font-size:.92rem; max-width:60ch; }
.pp-banner-deco { position:absolute; right:18px; bottom:-10px; font-size:90px; color:rgba(34,197,94,.10); pointer-events:none; }

/* ---- Cards ---- */
.pp-card { background:var(--pp-card); border:1px solid var(--pp-line); border-radius:18px; padding:24px; margin-bottom:20px; }
.pp-card-title { display:flex; align-items:center; gap:9px; font-size:1.05rem; font-weight:700; color:var(--pp-ink); margin:0 0 18px; }
.pp-card-title i { color:var(--pp-green); }
.pp-cols { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start; margin-bottom:20px; }
@media(max-width:900px){ .pp-cols{ grid-template-columns:1fr; } }

/* ---- Formularios ---- */
.pp-field { margin-bottom:16px; }
.pp-field > label { display:block; font-size:13px; font-weight:600; color:var(--pp-ink); margin-bottom:6px; }
.pp-input, .pp-card input[type=text], .pp-card input[type=email], .pp-card input[type=tel],
.pp-card input[type=date], .pp-card input[type=password], .pp-card select {
    width:100%; box-sizing:border-box; background:var(--pp-input); border:1px solid var(--pp-line); color:var(--pp-ink);
    border-radius:11px; padding:12px 14px; font-size:14px; font-family:inherit; outline:none; transition:border-color .15s; }
.pp-card input:focus, .pp-card select:focus { border-color:var(--pp-green); }
.pp-card input[readonly], .pp-card input[disabled] { opacity:.7; cursor:not-allowed; }
.pp-hint { font-size:11.5px; color:var(--pp-mut2); margin-top:5px; }

/* password con ojo */
.pp-pass { position:relative; }
.pp-pass input { padding-right:42px; }
.pp-pass .pp-eye { position:absolute; right:6px; top:50%; transform:translateY(-50%); background:transparent; border:none;
    color:var(--pp-mut); cursor:pointer; width:32px; height:32px; border-radius:8px; }
.pp-pass .pp-eye:hover { color:var(--pp-green); }

/* ---- Botones ---- */
.pp-btn { display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:11px; font-size:14px; font-weight:700;
    cursor:pointer; border:none; transition:all .18s; font-family:inherit; }
.pp-btn-primary { background:var(--pp-green); color:#06210f; box-shadow:0 8px 20px rgba(34,197,94,.25); }
.pp-btn-primary:hover { background:#16a34a; transform:translateY(-1px); }
.pp-btn-ghost { background:transparent; color:var(--pp-mut); border:1px solid var(--pp-line); }
.pp-btn-ghost:hover { border-color:var(--pp-green); color:var(--pp-green); }

/* ---- Barra de estadísticas ---- */
.pp-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; padding:18px; margin-bottom:24px;
    background:var(--pp-card); border:1px solid var(--pp-line); border-radius:18px; }
@media(max-width:760px){ .pp-stats{ grid-template-columns:repeat(2,1fr); } }
.pp-stat { display:flex; align-items:center; gap:14px; padding:6px 10px; }
.pp-stat + .pp-stat { border-left:1px solid var(--pp-line); }
@media(max-width:760px){ .pp-stat + .pp-stat{ border-left:none; } }
.pp-stat-ico { width:46px; height:46px; flex:none; border-radius:12px; display:grid; place-items:center; font-size:18px;
    background:rgba(34,197,94,.12); border:1px solid rgba(34,197,94,.25); color:var(--pp-green); }
.pp-stat-num { font-size:1.5rem; font-weight:800; color:var(--pp-strong); line-height:1; }
.pp-stat-lbl { font-size:12px; color:var(--pp-mut); margin-top:3px; }

/* ---- Cards de emprendimiento (venture list) ---- */
.pp-vgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
@media(max-width:900px){ .pp-vgrid{ grid-template-columns:1fr; } }
.pp-vcard { background:var(--pp-card); border:1px solid var(--pp-line); border-radius:18px; overflow:hidden;
    transition:transform .2s, box-shadow .2s, border-color .2s; }
.pp-vcard:hover { transform:translateY(-4px); box-shadow:0 22px 44px rgba(0,0,0,.4); border-color:rgba(34,197,94,.3); }
.pp-vcard-cover { position:relative; height:160px; background:#0f1411; overflow:hidden; }
.pp-vcard-coverimg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; display:block; border-radius:0; }
.pp-vcard-logo { position:absolute; left:20px; bottom:-26px; width:64px; height:64px; border-radius:50%; object-fit:cover;
    border:3px solid #11181f; background:#11181f; }
.pp-vcard-toggle { position:absolute; top:14px; right:14px; display:inline-flex; align-items:center; gap:8px;
    background:rgba(0,0,0,.45); padding:5px 8px 5px 12px; border-radius:50px; font-size:11px; font-weight:700; color:#fff; backdrop-filter:blur(4px); }
.pp-vcard-body { padding:34px 20px 18px; }
.pp-vcard-name { display:flex; align-items:center; gap:7px; font-size:1.25rem; font-weight:700; color:var(--pp-strong); margin:0 0 2px; }
.pp-vcard-cat { font-size:11.5px; font-weight:700; letter-spacing:.4px; color:var(--pp-green); text-transform:uppercase; margin-bottom:10px; }
.pp-vcard-desc { font-size:13.5px; color:var(--pp-mut); line-height:1.55; margin:0 0 16px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pp-vcard-stats { display:flex; gap:20px; padding:14px 0; border-top:1px solid var(--pp-line); border-bottom:1px solid var(--pp-line); margin-bottom:12px; }
.pp-vcard-stat { display:flex; align-items:center; gap:7px; font-size:13.5px; color:var(--pp-mut); }
.pp-vcard-stat b { color:var(--pp-ink); font-weight:700; }
.pp-vcard-stat i { color:var(--pp-mut2); }
.pp-vcard-actions { display:flex; gap:4px; }
.pp-vcard-actions a, .pp-vcard-actions button { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:7px;
    background:transparent; border:none; color:var(--pp-mut); font-size:13px; font-weight:600; padding:10px 6px; border-radius:10px;
    cursor:pointer; text-decoration:none; transition:all .15s; font-family:inherit; }
.pp-vcard-actions a:hover, .pp-vcard-actions button:hover { background:rgba(255,255,255,.05); color:var(--pp-ink); }
.pp-vcard-actions .pp-del:hover { background:rgba(239,68,68,.12); color:#f87171; }

/* switch ACTIVO */
.pp-switch { position:relative; width:38px; height:20px; border-radius:50px; background:#3a4550; border:none; cursor:pointer; transition:background .2s; }
.pp-switch::after { content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:#fff; transition:transform .2s; }
.pp-switch.on, .pp-switch.is-active { background:var(--pp-green); }
.pp-switch.on::after, .pp-switch.is-active::after { transform:translateX(18px); }
.pp-vcard-toggle .venture-status-badge { text-transform:uppercase; letter-spacing:.3px; background:transparent !important; color:#fff !important; padding:0 !important; font-size:11px !important; font-weight:700 !important; box-shadow:none !important; }
.pp-vcard-toggle .venture-status-badge.is-paused { color:#fca5a5 !important; }

/* ---- Lista de actividad ---- */
.pp-activity { list-style:none; padding:0; margin:0; }
.pp-activity li { display:flex; align-items:center; gap:12px; padding:12px 4px; border-bottom:1px solid var(--pp-line); font-size:13.5px; color:var(--pp-ink); }
.pp-activity li:last-child { border-bottom:none; }
.pp-activity .pp-act-ico { width:26px; height:26px; flex:none; border-radius:50%; display:grid; place-items:center; font-size:12px;
    background:rgba(34,197,94,.14); color:var(--pp-green); }
.pp-activity .pp-act-date { margin-left:auto; color:var(--pp-mut2); font-size:12.5px; white-space:nowrap; }

/* ---- Tabla de logs ---- */
.pp-table-wrap { background:var(--pp-card); border:1px solid var(--pp-line); border-radius:14px; overflow:hidden; }
.pp-table { width:100%; border-collapse:collapse; }
.pp-table thead th { text-align:left; padding:13px 16px; font-size:12px; text-transform:uppercase; letter-spacing:.4px;
    color:var(--pp-mut2); font-weight:600; background:rgba(255,255,255,.02); border-bottom:1px solid var(--pp-line); }
.pp-table tbody td { padding:13px 16px; font-size:13.5px; color:var(--pp-ink); border-bottom:1px solid var(--pp-line); }
.pp-table tbody tr:last-child td { border-bottom:none; }
.pp-table tbody td.pp-evt { display:flex; align-items:center; gap:9px; }
.pp-table .pp-evt i { color:var(--pp-green); font-size:13px; }
.pp-table td.pp-mut, .pp-table .pp-mut { color:var(--pp-mut); }

.pp-empty { color:var(--pp-mut); font-size:14px; padding:24px; text-align:center; }
