/* MIXED CSS PACK */
/* Template: testchat.netfan.host/index.php */
/* Template mtime: 2025-09-30 18:03:35 */

/* ===== INLINE <style> BLOCK #1 ===== */
:root{
    --bg:#0f172a; --card:#0b1220; --me:#22c55e; --meText:#052914;
    --bot:#ffffff; --botText:#0b1220; --muted:#94a3b8;
  }
  html,body{height:100%}
  body{
    background:#0f172a; margin:0; color:#e2e8f0;
    font:16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial;
    display:flex; align-items:center; justify-content:center;
  }
  .phone{
    width:360px; max-width:92vw; height:92vh; min-height:640px;
    background:var(--card); border-radius:24px; box-shadow:0 20px 60px rgba(0,0,0,.55);
    display:flex; flex-direction:column; overflow:hidden; margin:24px auto;
  }
  header{height:56px; display:flex; align-items:center; gap:10px; padding:10px 12px; background:#0d1728}
  .avatar{width:36px; height:36px; border-radius:50%; background:linear-gradient(135deg,#7c3aed,#22c55e); display:grid; place-items:center; font-weight:800}
  .meta{display:flex; flex-direction:column}
  .name{font-weight:700}
  .status{font-size:12px; color:var(--muted)}
  .log{flex:1; overflow:auto; padding:10px; background:#0b1220}
  .b{display:flex; gap:8px; margin:8px 0}
  .msg{max-width:78%; padding:10px 12px; border-radius:12px; font-size:14px; line-height:1.35; word-wrap:break-word; white-space:pre-wrap}
  .bot .msg{background:var(--bot); color:var(--botText); border-top-left-radius:4px}
  .me{justify-content:flex-end}
  .me .msg{background:var(--me); color:var(--meText); border-top-right-radius:4px}
  .time{display:block; margin-top:4px; font-size:11px; color:#667789}
  form{display:flex; gap:8px; padding:10px; background:#0d1728}
  input[type=text]{
    flex:1; padding:10px 14px; border-radius:999px; border:1px solid transparent;
    background:#0f1a2f; color:#e2e8f0; outline:none;
  }
  button{
    padding:10px 16px; border-radius:999px; border:none; background:var(--me); color:var(--meText);
    font-weight:800; cursor:pointer;
  }
  /* Typing dots (WhatsApp-like) */
  .typing{display:inline-flex; gap:4px; align-items:center}
  .dot{width:6px; height:6px; border-radius:50%; background:#9aa6b2; opacity:.6; animation:bounce 1.2s infinite}
  .dot:nth-child(2){animation-delay:.2s}
  .dot:nth-child(3){animation-delay:.4s}
  @keyframes bounce{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-5px);opacity:1}}
  a{color:#0ea5e9; text-decoration:none}
  a:hover{text-decoration:underline}
  @media (min-width:900px){
    /* estilo “teléfono al medio” en desktop */
    body{padding:36px 0}
  }

      

{
    "template": "testchat.netfan.host/index.php",
    "template_mtime": 1759255415,
    "template_mtime_human": "2025-09-30T18:03:35+00:00",
    "css_links_found": [],
    "css_links_external": [],
    "css_links_embedded": [],
    "inline_style_blocks": 1,
    "inline_imports_external": [],
    "inline_imports_embedded": [],
    "missing_css_files": []
}