/* ===========================================================================
   FirOn — كسوة مكتبة البرومبت وصفحة إضافة برومبت
   يُكتب فوق ماركب الشورت كودَين [firon_prompts_library] و[firon_prompt_submit_form]
   بأصنافهما الحقيقية كما هي. لا يعتمد على أي عنصر أو صنف غير موجود في مخرج الإضافة،
   ولا يُخفي أي عنصر وظيفي. رموز نظام تصميم FirOn فقط.
   =========================================================================== */
:root{--surface-warm:#FCF5EF;--gold-decor:#A08A5C;--gold-decor-30:color-mix(in srgb,var(--gold-decor) 30%,transparent)}

/* ---------- الحاوية العامة للصفحتين ---------- */
.firon-prompts-archive{max-inline-size:1200px;margin-inline:auto;padding-inline:var(--space-8);padding-block:var(--space-16);font-family:var(--font-core);color:var(--text-body);text-align:start}
.firon-prompts-archive>*+*{margin-block-start:var(--space-12)}

/* ---------- مسار التنقّل ---------- */
.firon-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);font-size:var(--fs-caption);line-height:1.6;color:var(--text-muted)}
.firon-breadcrumbs a{color:var(--color-action);text-decoration-line:underline;text-decoration-thickness:1px;text-decoration-color:transparent;text-underline-offset:3px;transition:color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}
.firon-breadcrumbs a:hover{color:var(--brand-800);text-decoration-color:currentColor;text-decoration-thickness:2px}
.firon-breadcrumb-separator{color:var(--gold-decor)}
.firon-breadcrumbs [aria-current=page]{color:var(--text-heading);font-weight:var(--fw-medium)}

/* ---------- عنوان علوي صغير ---------- */
.firon-kicker{display:inline-flex;align-items:center;min-block-size:28px;padding-inline:var(--space-3);border-radius:var(--radius-pill);background:var(--brand-50);color:var(--brand-700);font-size:var(--fs-caption);font-weight:var(--fw-semibold);letter-spacing:var(--ls-caption);line-height:1.6}

/* ---------- هيرو المكتبة ---------- */
.firon-library-hero{display:grid;grid-template-columns:1.08fr .92fr;gap:var(--space-12);align-items:center;background:var(--surface-card);border:var(--border-width) solid var(--border-subtle);border-radius:16px;padding:var(--space-12)}
.firon-library-hero-content>*+*{margin-block-start:var(--space-4)}
.firon-library-hero h1{font-size:var(--fs-h2);font-weight:var(--fw-bold);line-height:var(--lh-heading);color:var(--text-heading);margin:0}
.firon-library-hero-lead{font-size:var(--fs-body-lg);line-height:var(--lh-body);color:var(--text-body);margin:0;max-inline-size:60ch}
.firon-library-hero-license{font-size:var(--fs-small);line-height:var(--lh-body);color:var(--text-muted);margin:0}
.firon-library-hero-license a{color:var(--color-action);text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.firon-library-hero-license a:hover{color:var(--brand-800);text-decoration-thickness:2px}
.firon-library-hero-actions{display:flex;align-items:stretch;gap:var(--space-3);flex-wrap:wrap;margin-block-start:var(--space-8)}
.firon-primary-action,.firon-secondary-action{display:inline-flex;align-items:center;justify-content:center;min-block-size:48px;padding-inline:var(--space-6);border-radius:var(--radius-sm);font-size:var(--fs-small);font-weight:var(--fw-semibold);line-height:1.6;text-decoration:none;white-space:nowrap;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}
.firon-primary-action{min-inline-size:180px;background:var(--color-action);border:var(--border-width-strong) solid var(--color-action);color:var(--white)}
.firon-primary-action:hover{background:var(--color-action-hover);border-color:var(--color-action-hover);color:var(--white)}
.firon-primary-action:active{background:var(--color-action-active);border-color:var(--color-action-active)}
.firon-secondary-action{background:transparent;border:var(--border-width-strong) solid var(--brand-600);color:var(--brand-700);font-weight:var(--fw-medium)}
.firon-secondary-action:hover{background:var(--brand-50);border-color:var(--brand-700);color:var(--brand-800)}
.firon-secondary-action:active{background:var(--brand-200);color:var(--brand-900)}
.firon-library-hero-visual{position:relative;aspect-ratio:16/9;background:var(--brand-50);border:var(--border-width) solid var(--brand-200);border-radius:16px;overflow:hidden}
.firon-library-hero-visual img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;object-position:center 15%;display:block}

/* ---------- المسارات السريعة ---------- */
.firon-navigation-tree{background:var(--surface-warm);border:var(--border-width) solid var(--gold-decor-30);border-radius:16px;padding:var(--space-12)}
.firon-navigation-tree-head{max-inline-size:70ch;margin-block-end:var(--space-8)}
.firon-navigation-tree-head h2{font-size:var(--fs-h3);font-weight:var(--fw-semibold);line-height:var(--lh-heading);color:var(--text-heading);margin:var(--space-3) 0 var(--space-2)}
.firon-navigation-tree-head p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body);margin:0}
.firon-navigation-tree-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.firon-navigation-card{display:flex;flex-direction:column;gap:6px;background:var(--surface-card);border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-6);text-decoration:none;transition:transform var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard),border-color var(--duration-base) var(--ease-standard)}
.firon-navigation-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:var(--brand-200)}
.firon-navigation-card span{font-size:var(--fs-caption);font-weight:var(--fw-medium);letter-spacing:var(--ls-caption);line-height:1.6;color:var(--text-muted)}
.firon-navigation-card strong{font-size:var(--fs-h4);font-weight:var(--fw-semibold);line-height:1.5;color:var(--text-heading)}
.firon-navigation-card small{font-size:var(--fs-small);font-weight:var(--fw-regular);line-height:var(--lh-body);color:var(--text-body)}
.firon-navigation-card-main{background:var(--color-surface-inverse);border-color:var(--color-surface-inverse)}
.firon-navigation-card-main span{color:var(--brand-200)}
.firon-navigation-card-main strong{color:var(--white)}
.firon-navigation-card-main small{color:var(--brand-50)}
.firon-navigation-card-main:hover{border-color:var(--brand-400)}
.firon-navigation-card-private{background:var(--brand-50);border-color:var(--brand-200)}
.firon-navigation-card-private strong{color:var(--brand-800)}

/* ---------- شريط الفلاتر ---------- */
.firon-prompt-filters{display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) auto auto;gap:var(--space-4);align-items:end;background:var(--surface-card);border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-6)}
.firon-prompt-filters label{display:flex;flex-direction:column;gap:6px;min-inline-size:0}
.firon-prompt-filters label>span{font-size:var(--fs-caption);font-weight:var(--fw-medium);line-height:1.6;color:var(--text-muted)}
.firon-prompt-filters select,.firon-prompt-filters input[type=search]{inline-size:100%;min-block-size:var(--touch-min);padding-block:10px;padding-inline:var(--space-3) 34px;border:var(--border-width) solid var(--border-default);border-radius:var(--radius-sm);background:var(--white);color:var(--text-body);font-family:var(--font-core);font-size:var(--fs-small);line-height:1.6;text-overflow:ellipsis;transition:border-color var(--duration-fast) var(--ease-standard)}
.firon-prompt-filters select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A7391' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 12px center;background-size:16px 16px}
.firon-prompt-filters input[type=search]{padding-inline:var(--space-3)}
.firon-prompt-filters input[type=search]::placeholder{color:var(--ink-500)}
.firon-prompt-filters select:hover,.firon-prompt-filters input[type=search]:hover{border-color:var(--brand-400)}
.firon-prompt-filters select:focus,.firon-prompt-filters input[type=search]:focus{border-color:var(--brand-700)}
.firon-prompt-filters button[type=submit]{min-inline-size:110px;min-block-size:var(--touch-min);padding-inline:var(--space-6);border:var(--border-width-strong) solid var(--color-action);border-radius:var(--radius-sm);background:var(--color-action);color:var(--white);font-family:var(--font-core);font-size:var(--fs-small);font-weight:var(--fw-semibold);line-height:1.6;cursor:pointer;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.firon-prompt-filters button[type=submit]:hover{background:var(--color-action-hover);border-color:var(--color-action-hover)}
.firon-prompt-filters button[type=submit]:active{background:var(--color-action-active);border-color:var(--color-action-active)}
.firon-clear-filter{display:inline-flex;align-items:center;justify-content:center;min-block-size:var(--touch-min);padding-inline:var(--space-4);border-radius:var(--radius-sm);color:var(--color-action);font-size:var(--fs-small);font-weight:var(--fw-medium);line-height:1.6;text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:3px;white-space:nowrap;transition:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}
.firon-clear-filter:hover{background:var(--brand-50);color:var(--brand-800);text-decoration-thickness:2px}

/* ---------- شبكة البطاقات ---------- */
.firon-prompt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6);align-items:stretch}
.firon-prompt-card{display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface-card);border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-6);block-size:100%;transition:transform var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard),border-color var(--duration-base) var(--ease-standard)}
.firon-prompt-card:hover,.firon-prompt-card:focus-within{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:var(--brand-200)}
.firon-prompt-card h3{font-size:var(--fs-h4);font-weight:var(--fw-semibold);line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding-block-end:2px}
.firon-prompt-card h3 a{color:var(--text-heading);text-decoration:none;transition:color var(--duration-fast) var(--ease-standard)}
.firon-prompt-card h3 a:hover{color:var(--color-action)}
.firon-prompt-meta{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.firon-badge{display:inline-flex;align-items:center;min-block-size:36px;padding-inline:var(--space-3);border-radius:var(--radius-pill);background:var(--brand-50);border:var(--border-width) solid var(--brand-200);color:var(--brand-700);font-size:var(--fs-caption);font-weight:var(--fw-medium);line-height:1.6;text-decoration:none;transition:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.firon-badge:hover{background:var(--brand-200);border-color:var(--brand-400);color:var(--brand-800)}
.firon-teacher-badge{background:var(--surface-warm);border-color:var(--gold-decor-30);color:var(--brand-900);font-weight:var(--fw-semibold)}
.firon-teacher-badge:hover{background:var(--accent-yellow);border-color:var(--gold-decor);color:var(--brand-900)}
.firon-card-engagement{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-4);font-size:var(--fs-caption);font-weight:var(--fw-regular);line-height:1.6;color:var(--text-muted)}
.firon-prompt-card p{font-size:var(--fs-small);line-height:var(--lh-body);color:var(--text-body);margin:0}
.firon-prompt-card p strong{font-weight:var(--fw-semibold);color:var(--text-heading)}
.firon-read-more{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-block-size:var(--touch-min);margin-block-start:auto;padding-inline:var(--space-6);border:var(--border-width-strong) solid var(--brand-600);border-radius:var(--radius-sm);background:transparent;color:var(--brand-700);font-size:var(--fs-small);font-weight:var(--fw-medium);line-height:1.6;text-decoration:none;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}
.firon-read-more:hover{background:var(--brand-50);border-color:var(--brand-700);color:var(--brand-800)}
.firon-read-more:active{background:var(--brand-200);color:var(--brand-900)}

/* ---------- الترقيم ---------- */
.firon-pagination{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-2)}
.firon-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-inline-size:var(--touch-min);min-block-size:var(--touch-min);padding-inline:var(--space-3);border:var(--border-width) solid var(--border-default);border-radius:var(--radius-sm);background:var(--white);color:var(--color-action);font-family:var(--font-latin),var(--font-core);font-size:var(--fs-small);font-weight:var(--fw-medium);line-height:1.6;text-decoration:none;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}
.firon-pagination a.page-numbers:hover{background:var(--brand-50);border-color:var(--brand-400);color:var(--brand-800)}
.firon-pagination .page-numbers.current{background:var(--color-action);border:var(--border-width-strong) solid var(--brand-900);color:var(--white);font-weight:var(--fw-bold)}
.firon-pagination .page-numbers.dots{border-color:transparent;background:transparent;color:var(--text-muted);min-inline-size:32px;padding-inline:0}
.firon-pagination .next{padding-inline:var(--space-6);font-family:var(--font-core)}

/* ---------- الاستجابة ---------- */
@media (max-width:1200px){.firon-prompt-filters{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}.firon-prompt-filters button[type=submit],.firon-clear-filter{align-self:end}}
@media (max-width:1024px){
.firon-prompts-archive{padding-block:var(--space-12)}
.firon-library-hero,.firon-navigation-tree{padding:var(--space-8)}
.firon-library-hero{grid-template-columns:1fr;gap:var(--space-8)}
.firon-navigation-tree-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.firon-prompt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.firon-prompt-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
.firon-prompts-archive{padding-inline:var(--gutter)}
.firon-library-hero,.firon-navigation-tree,.firon-prompt-filters{padding:var(--space-6)}
.firon-navigation-tree-grid,.firon-prompt-grid,.firon-prompt-filters{grid-template-columns:1fr}
.firon-library-hero-actions{flex-direction:column;align-items:stretch}
.firon-primary-action,.firon-secondary-action,.firon-prompt-filters button[type=submit],.firon-clear-filter,.firon-read-more{inline-size:100%;min-inline-size:0}
.firon-badge{min-block-size:var(--touch-min)}
.firon-library-hero h1{font-size:var(--fs-h3)}
}
@media (prefers-reduced-motion:reduce){
.firon-navigation-card,.firon-prompt-card{transition:none}
.firon-navigation-card:hover,.firon-prompt-card:hover,.firon-prompt-card:focus-within{transform:none}
}