/* X-GPT minimal, modern UI */
.xgpt, .xgpt .xgpt-form, .xgpt .xgpt-results { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; }
.xgpt { --bg: #111827; --fg: #e5e7eb; --muted:#9ca3af; --accent:#10b981; --border:#1f2937; --card:#0b1220; }
.xgpt[data-theme="light"] { --bg:#ffffff; --fg:#111827; --muted:#6b7280; --border:#e5e7eb; --card:#f9fafb; }
.xgpt[data-theme="auto"] { color-scheme: light dark; }
.xgpt { background: var(--card); color: var(--fg); border: 1px solid var(--border); padding: 18px; border-radius: 16px; box-shadow: 0 10px 18px rgba(0,0,0,.15); }

.xgpt .xgpt-row { margin-bottom: 14px; }
.xgpt .xgpt-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-bottom: 12px; }
@media (max-width:900px){ .xgpt .xgpt-grid{ grid-template-columns: 1fr; } }

.xgpt label { display:block; font-weight:600; margin-bottom:6px; color: var(--fg); }
.xgpt textarea, .xgpt input[type="text"], .xgpt input[type="url"], .xgpt input[type="password"], .xgpt .xgpt-select {
    width:100%; background: var(--bg); color: var(--fg); border:1px solid var(--border);
    border-radius:12px; padding:10px 12px; outline:none;
}
.xgpt textarea:focus, .xgpt input:focus, .xgpt select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(16,185,129,.25); }

.xgpt .xgpt-styles { border:1px dashed var(--border); border-radius:14px; padding:10px 12px; margin-bottom:14px; }
.xgpt .xgpt-styles legend { padding:0 6px; color: var(--muted); }
.xgpt .xgpt-styles label { display:inline-flex; align-items:center; gap:6px; margin:6px 10px 6px 0; font-weight:500; }

.xgpt .xgpt-btn {
    background: var(--accent); color:#032b1f; border:none; border-radius:12px; padding:10px 14px; font-weight:700; cursor:pointer;
    transition: transform .05s ease-in-out;
}
.xgpt .xgpt-btn:active { transform: translateY(1px); }
.xgpt .xgpt-spinner { width:18px; height:18px; border-radius:50%; border:3px solid var(--border); border-top-color: var(--accent); display:inline-block; margin-left:10px; animation: xgpt-spin .8s linear infinite; }
@keyframes xgpt-spin { to { transform: rotate(360deg); } }

.xgpt .xgpt-results { margin-top:14px; border:1px solid var(--border); border-radius:14px; padding:10px; background: var(--bg); }
.xgpt .xgpt-actions { display:flex; justify-content:flex-end; gap:8px; margin-bottom:6px; flex-wrap:wrap; }
.xgpt .xgpt-copy { background:transparent; border:1px solid var(--border); color:var(--fg); border-radius:10px; padding:6px 10px; cursor:pointer; }
.xgpt .xgpt-output { white-space:pre-wrap; max-height:60vh; overflow:auto; background: #0a0f1a; color:#e5e7eb; border-radius:10px; padding:12px; border:1px solid var(--border); }

.xgpt .xgpt-title,.xgpt .xgpt-meta,.xgpt .xgpt-tags,.xgpt .xgpt-featured,.xgpt .xgpt-imgs{background:var(--bg);color:var(--fg);border:1px solid var(--border);border-radius:10px;padding:8px 10px;min-width:260px;}
.xgpt-note { padding:12px; border-radius:12px; background:#fff3cd; color:#6b4700; border:1px solid #ffe69c; }

/* Admin tweaks */
.xgpt-admin .xgpt-tabs .nav-tab { border-top-left-radius:10px; border-top-right-radius:10px; }
.xgpt-admin .xgpt-info .xgpt-columns { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:8px; }
.xgpt-admin .xgpt-grid label { display:flex; flex-direction:column; gap:6px; }
