/* ==========================================================================
   Telkini v130 — نافذة «إضافة نص» (المبرمج والأدمن)
   ========================================================================== */
.tk-add-modal {
  --a-green: #16a34a; --a-green-d: #15803d; --a-tint: #ecfdf3; --a-ink: #0f172a; --a-muted: #64748b;
  --a-line: #e5e7eb; --a-bg: #fff; --a-soft: #f8fafc;
  position: fixed; inset: 0; z-index: 9990; display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(15, 23, 42, .5); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
}
.tk-add-modal[hidden] { display: none; }
html.dark .tk-add-modal { --a-tint: rgba(22, 163, 74, .14); --a-ink: #f1f5f9; --a-muted: #94a3b8; --a-line: #1f2a3c; --a-bg: #0f172a; --a-soft: #131d31; }
html.tk-add-open, html.tk-add-open body { overflow: hidden; }

.tk-add-panel { width: min(680px, 100%); max-height: min(780px, 92vh); display: flex; flex-direction: column; overflow: hidden; background: var(--a-bg); color: var(--a-ink); border: 1px solid var(--a-line); border-radius: 22px; box-shadow: 0 24px 60px -18px rgba(15, 23, 42, .45); font-family: Cairo, Tajawal, sans-serif; }
.tk-add-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--a-line); }
.tk-add-htxt { flex: 1; min-width: 0; }
.tk-add-htxt h2 { margin: 0; font: 800 16px/1.3 Cairo, sans-serif; color: var(--a-ink); }
.tk-add-htxt p { margin: 0; font: 600 12.5px/1.5 Cairo, sans-serif; color: var(--a-muted); }
.tk-add-tile { width: 38px; height: 38px; border-radius: 12px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; background: var(--a-tint); color: var(--a-green-d); }
html.dark .tk-add-tile { color: #4ade80; }
.tk-add-tile.is-big { width: 54px; height: 54px; border-radius: 16px; }
.tk-add-tile.is-ok { background: var(--a-green); color: #fff; }
.tk-add-x { width: 32px; height: 32px; border: 0; border-radius: 10px; background: none; color: var(--a-muted); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; }
.tk-add-x:hover { background: var(--a-soft); color: var(--a-ink); }

.tk-add-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.tk-add-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px 16px; text-align: center; border: 2px dashed #bbf7d0; border-radius: 16px; background: var(--a-soft); cursor: pointer; transition: border-color .15s, background .15s; }
html.dark .tk-add-drop { border-color: rgba(34, 197, 94, .35); }
.tk-add-drop:hover, .tk-add-drop.is-over, .tk-add-drop:focus-within { border-color: var(--a-green); background: var(--a-tint); }
.tk-add-drop b { font: 800 14.5px Cairo, sans-serif; color: var(--a-ink); margin-top: 4px; }
.tk-add-drop > span:not(.tk-add-tile) { font: 600 12.5px/1.7 Cairo, sans-serif; color: var(--a-muted); }
.tk-add-sr { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

.tk-add-files:empty { display: none; }
.tk-add-files { display: flex; flex-direction: column; gap: 6px; }
.tk-add-file { display: flex; align-items: center; gap: 8px; padding: 5px 10px; border: 1px solid var(--a-line); border-radius: 11px; font: 600 13px Cairo, Inter, sans-serif; color: var(--a-ink); }
.tk-add-file span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-add-file svg { flex-shrink: 0; }

.tk-add-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 520px) { .tk-add-row { grid-template-columns: 1fr; } }
.tk-add-field { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tk-add-field > span { font: 700 12px Cairo, sans-serif; color: var(--a-muted); }
.tk-add-input { width: 100%; box-sizing: border-box; padding: 8px 11px; border-radius: 11px; border: 1px solid var(--a-line); background: var(--a-bg); color: var(--a-ink); font: 500 14px/1.65 Cairo, Inter, sans-serif; outline: none; }
.tk-add-input:focus { border-color: var(--a-green); box-shadow: 0 0 0 3px rgba(22, 163, 74, .14); }
textarea.tk-add-input { resize: vertical; }
.tk-add-ans { border-color: var(--a-green); background: var(--a-tint); font-weight: 700; }
.tk-add-anslabel { color: var(--a-green-d) !important; }
html.dark .tk-add-anslabel { color: #4ade80 !important; }

.tk-add-more summary, .tk-add-group summary { cursor: pointer; font: 700 13px Cairo, sans-serif; color: var(--a-ink); padding: 4px 2px; }
.tk-add-more { display: flex; flex-direction: column; gap: 6px; }
.tk-add-more[open] > * + * { margin-top: 6px; }
.tk-add-group { border: 1px solid var(--a-line); border-radius: 14px; padding: 8px 12px; }
.tk-add-group[open] { padding-bottom: 12px; }
.tk-add-group[open] > * + * { margin-top: 8px; }
.tk-add-part { display: flex; flex-direction: column; gap: 10px; }
.tk-add-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.tk-add-tab { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--a-line); background: var(--a-bg); color: var(--a-ink); font: 700 13px Inter, Cairo, sans-serif; cursor: pointer; }
.tk-add-tab.is-on { background: var(--a-green); border-color: var(--a-green); color: #fff; }
.tk-add-note { display: flex; align-items: flex-start; gap: 8px; padding: 9px 12px; border-radius: 12px; border: 1px solid #fde68a; background: #fffbeb; color: #92400e; font: 600 13px/1.7 Cairo, sans-serif; }
.tk-add-note svg { flex-shrink: 0; margin-top: 3px; }
html.dark .tk-add-note { background: rgba(245, 158, 11, .1); border-color: rgba(245, 158, 11, .35); color: #fcd34d; }

.tk-add-wait { flex: 1; min-height: 240px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; }
.tk-add-wait b { font: 800 15px Cairo, sans-serif; color: var(--a-ink); }
.tk-add-wait > span:not(.tk-add-tile):not(.tk-add-spin) { font: 600 13px Cairo, sans-serif; color: var(--a-muted); }
.tk-add-spin { width: 36px; height: 36px; border-radius: 50%; border: 3px solid var(--a-tint); border-top-color: var(--a-green); animation: tkc-spin .8s linear infinite; }

.tk-add-foot { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--a-line); }
.tk-add-foot:empty { display: none; }
.tk-add-msg { flex: 1; min-width: 0; margin: 0; font: 700 12.5px/1.6 Cairo, sans-serif; color: var(--a-muted); }
.tk-add-msg.is-err { color: #dc2626; }
.tk-add-btn { flex-shrink: 0; height: 40px; padding: 0 18px; border: 0; border-radius: 12px; background: var(--a-green); color: #fff; font: 800 13.5px Cairo, sans-serif; cursor: pointer; }
.tk-add-btn:hover { background: var(--a-green-d); }
.tk-add-btn[disabled] { opacity: .6; cursor: wait; }
.tk-add-btn.is-ghost { background: transparent; color: var(--a-ink); border: 1px solid var(--a-line); }
.tk-add-btn.is-ghost:hover { background: var(--a-soft); }

/* v136: الكتابة بالذكاء الاصطناعي */
.tk-add-modes .tk-add-tab { flex: 1; font-family: Cairo, sans-serif; }
.tk-add-pos { min-width: 0; }
.tk-add-parts { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tk-add-parts legend { padding: 0; margin-bottom: 4px; font: 700 12px Cairo, sans-serif; color: var(--a-muted); }
.tk-add-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--a-line); border-radius: 999px; font: 700 13px Inter, Cairo, sans-serif; color: var(--a-ink); cursor: pointer; }
.tk-add-chip:has(input:checked) { border-color: var(--a-green); background: var(--a-tint); }
.tk-add-chip:has(input:focus-visible) { outline: 2px solid var(--a-green); outline-offset: 2px; }
.tk-add-chip input { accent-color: var(--a-green); margin: 0; }
.tk-add-steps { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.tk-add-steps li { padding: 4px 12px; border-radius: 999px; background: var(--a-soft); color: var(--a-muted); font: 700 12.5px Inter, sans-serif; }
.tk-add-steps li.is-now { background: var(--a-tint); color: var(--a-green-d); }
.tk-add-steps li.is-done { background: var(--a-green); color: #fff; }
.tk-add-steps li.is-fail { background: #fee2e2; color: #b91c1c; }
html.dark .tk-add-steps li.is-now { color: #4ade80; }

.tk-add-retry { align-self: flex-start; }

/* زر + بين البطاقات */
.tk-add-card { position: relative; overflow: visible !important; }
.tk-add-here {
  position: absolute; bottom: 10px; right: 50%; z-index: 5; width: 26px; height: 26px; transform: translateX(50%);
  display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 2px solid #fff; border-radius: 50%;
  background: #16a34a; color: #fff; cursor: pointer; opacity: 0; box-shadow: 0 4px 10px -4px rgba(22, 163, 74, .8); transition: opacity .15s, background .15s;
}
html.dark .tk-add-here { border-color: #0f172a; }
.tk-add-here:hover { background: #15803d; }
.tk-add-card:hover .tk-add-here, .tk-add-here:focus-visible { opacity: 1; }
.tk-add-here:focus-visible { outline: 2px solid #16a34a; outline-offset: 2px; }
/* اللمس والشاشات الضيقة: ظاهر دائماً لأنه لا يوجد مرور ماوس */
@media (hover: none), (max-width: 639px) { .tk-add-here { opacity: 1; } }

/* الزر فوق قائمة المواضيع */
.tk-add-bar { display: flex; justify-content: flex-start; margin-bottom: 12px; }
.tk-add-bar[hidden] { display: none; }
.tk-add-open { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border: 0; border-radius: 12px; background: #16a34a; color: #fff; font: 800 13px Cairo, sans-serif; cursor: pointer; box-shadow: 0 6px 16px -8px rgba(22, 163, 74, .8); }
.tk-add-open:hover { background: #15803d; }
.tk-add-open:focus-visible, .tk-add-btn:focus-visible, .tk-add-tab:focus-visible { outline: 3px solid rgba(22, 163, 74, .4); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) { .tk-add-spin { animation-duration: 2s; } }