/* style.css - simple, moderno y legible */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

body { font-family: 'Inter', sans-serif; margin: 0; color: #eef2ff; }
.bg-pattern { background: linear-gradient(135deg,#0f1724 0%,#07122a 100%); min-height:100vh; }

/* Card panel */
.card-panel { border-radius: 14px; background: rgba(255,255,255,0.03); color: #e6eef8; }

/* Logo */
.logo-img { width: 140px; }

/* client box */
.client-box { background: rgba(255,255,255,0.02); border-radius: 10px; }

/* Buttons style enhanced */
.notif-btn { border-radius: 10px; font-weight: 600; padding: 12px; transition: transform .12s ease; }
.notif-btn:hover { transform: translateY(-3px); }

/* Preview textarea */
#preview { background: rgba(0,0,0,0.35); color: #fff; border: 1px solid rgba(255,255,255,0.06); resize: vertical; }

/* Open button */
#openWspBtn { background: linear-gradient(90deg,#10b981,#06b6d4); border: none; color: #fff; }
#openWspBtn:hover { opacity: 0.95; transform: translateY(-2px); }

/* small screens */
@media (max-width:576px) {
    .logo-img { width: 110px; }
}