ميدياويكي:Common.css: الفرق بين النسختين

/* ============================================================================
   فيلسوف — Faylasof reading-room theme for MediaWiki/Wikibase  ·  v3
   Transforms the raw Wikibase entity-editor UI into a calm Arabic reader page.
   RTL-first. Phone + desktop. Loaded site-wide via MediaWiki:Common.css.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Tajawal:wght@400;500;700;800&display=swap');

:root{
  --paper:#f6f0e2; --paper-card:#fbf7ee; --paper-deep:#efe7d4; --paper-edge:#e3d8be;
  --ink:#221d12; --ink-soft:#4b4435; --muted:#6e6553;
  --emerald:#0c5b3c; --emerald-deep:#08402a; --emerald-bright:#0a8f5e; --emerald-tint:#e7efe6;
  --ink-deep:#0f1f18; --ink-deep-2:#16291f; --on-dark:#f3ecda; --on-dark-soft:#bcc7bb;
  --gold:#b0892f; --gold-soft:#d8bd79; --gold-deep:#7a5c1c;
  --font-display:"Amiri","Thmanyah Display","Noto Naskh Arabic",serif;
  --font-body:"Tajawal","Thmanyah Sans","SF Arabic","Segoe UI",sans-serif;
  --maxw:1140px; --radius:14px; --radius-sm:9px;
  --shadow-sm:0 6px 18px -10px rgba(40,28,8,.22);
  --shadow-md:0 22px 48px -22px rgba(28,20,6,.40);
}

/* ---- base ---- */
html,body{background:var(--paper)!important;color:var(--ink)!important;font-family:var(--font-body)!important;
  overflow-x:hidden;max-width:100%;}
body{font-size:16px;line-height:1.7;}
.firstHeading,.mw-first-heading,.wikibase-title{overflow-wrap:anywhere;}
/* neutralize the now-empty entity-terms pill (language grid is hidden) */
.wikibase-entitytermsview{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;}
.mw-body,.mw-page-container,.mw-page-container-inner,.vector-body,#content,.mw-body-content,.mw-content-container{
  background:transparent!important;color:var(--ink)!important;font-family:var(--font-body)!important;border:0!important;}
.mw-content-rtl,.mw-parser-output{font-family:var(--font-body)!important;}

/* soft parchment grain on the page */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(1200px 600px at 80% -5%,rgba(12,91,60,.06),transparent 60%);}
.mw-page-container{position:relative;z-index:1;}

/* ---- dark emerald header ---- */
.vector-header-container,.vector-header,.mw-header{
  background:linear-gradient(180deg,var(--ink-deep) 0%,var(--ink-deep-2) 100%)!important;
  color:var(--on-dark)!important;border-bottom:2px solid var(--gold)!important;box-shadow:var(--shadow-sm);}
.vector-header *,.mw-header *{color:var(--on-dark)!important;}
.mw-logo-wordmark{font-family:var(--font-display)!important;font-weight:700!important;font-size:30px!important;
  letter-spacing:.5px;color:var(--on-dark)!important;}
.mw-logo-tagline{display:none!important;}

/* search box -> warm pill */
.cdx-text-input__input,#searchInput{
  background:var(--paper-card)!important;border:1.5px solid var(--gold-soft)!important;color:var(--ink)!important;
  border-radius:999px!important;font-family:var(--font-body)!important;padding-inline:18px!important;height:42px!important;}
.cdx-text-input__input:focus,#searchInput:focus{border-color:var(--emerald-bright)!important;
  box-shadow:0 0 0 4px var(--emerald-tint)!important;outline:0!important;}
.cdx-search-input__end-button,.searchButton{border-radius:999px!important;}

/* ---- page title / first heading ---- */
.firstHeading,.mw-first-heading,.wikibase-title{
  font-family:var(--font-display)!important;color:var(--emerald-deep)!important;font-weight:700!important;
  border:0!important;padding-bottom:.15em!important;line-height:1.25!important;}
.firstHeading{font-size:clamp(1.9rem,5vw,3rem)!important;}
.mw-first-heading::after{content:"";display:block;width:72px;height:3px;margin-top:.45rem;
  background:linear-gradient(90deg,var(--gold),transparent);border-radius:2px;}
.wikibase-title-id{color:var(--muted)!important;font-size:.5em!important;font-weight:400!important;font-family:var(--font-body)!important;}
/* hide the "No label defined" placeholder — JS injects the Arabic label */
.wikibase-title-label:empty,.wikibase-labelview-text-placeholder{display:none;}

/* ---- entity terms (the multi-language editor grid) ---- */
/* Hide the noisy "In more languages" editor table entirely on read pages. */
.wikibase-entitytermsforlanguagelistview,
.wikibase-entitytermsview-entitytermsforlanguagelistview,
.wikibase-entitytermsview-entitytermsforlanguagelistview-toggler,
.wikibase-entitytermsview .wikibase-entitytermsforlanguagelistview-configure-link{display:none!important;}
/* Keep just the Arabic label+description block, presented as a lede. */
.wikibase-entitytermsview-heading{margin:.2rem 0 1.4rem!important;}
.wikibase-entitytermsview-heading-description,.wikibase-descriptionview-text{
  font-size:1.18rem!important;color:var(--ink-soft)!important;font-style:normal!important;}
.wikibase-aliasesview{color:var(--muted)!important;}
.wikibase-aliasesview-list li{background:var(--paper-deep)!important;border:1px solid var(--paper-edge)!important;
  border-radius:999px!important;padding:2px 12px!important;margin-inline-end:6px!important;}

/* ---- Statements -> reader cards ---- */
.wikibase-statementgrouplistview{margin-top:1.5rem;}
.wikibase-statementgrouplistview-heading,.wb-section-heading{font-family:var(--font-display)!important;}
.wikibase-statementgroupview{
  background:var(--paper-card)!important;border:1px solid var(--paper-edge)!important;border-radius:var(--radius)!important;
  box-shadow:var(--shadow-sm);margin:0 0 14px!important;overflow:hidden;display:flex;flex-wrap:wrap;}
.wikibase-statementgroupview-property{
  background:var(--emerald-tint)!important;border:0!important;border-inline-end:3px solid var(--gold-soft)!important;
  flex:0 0 220px;max-width:240px;padding:16px 18px!important;}
.wikibase-statementgroupview-property .wikibase-statementgroupview-property-label,
.wikibase-statementgroupview-property a{color:var(--emerald-deep)!important;font-weight:700!important;font-size:1.02rem!important;}
.wikibase-statementlistview{flex:1 1 260px;min-width:0;max-width:100%;padding:8px 6px!important;}
.wikibase-statementview{border:0!important;border-bottom:1px solid var(--paper-edge)!important;padding:10px 14px!important;}
.wikibase-statementview:last-child{border-bottom:0!important;}
.wikibase-statementview-mainsnak{font-size:1.05rem!important;color:var(--ink)!important;}
.wikibase-statementview-rankselector,.wikibase-toolbar,.wikibase-edittoolbar-container,
.wikibase-snakview-indicators,.wikibase-statementview-references-heading .ui-toggler,
[data-property-id] .wikibase-toolbar-button{display:none!important;}
.wikibase-statementview-references{font-size:.86rem;color:var(--muted)!important;}

/* links */
#content a,.mw-body a{color:var(--emerald)!important;text-decoration:none!important;}
#content a:hover,.mw-body a:hover{color:var(--gold-deep)!important;text-decoration:underline;}
#content a.new{color:#a3402f!important;}

/* ---- dark footer ---- */
.mw-footer-container,.vector-footer,#footer{
  background:var(--ink-deep)!important;color:var(--on-dark-soft)!important;border-top:2px solid var(--gold)!important;margin-top:2rem;}
.mw-footer-container *,.vector-footer *{color:var(--on-dark-soft)!important;}
.mw-footer-container a:hover{color:var(--gold-soft)!important;}

/* ---- hide editor / wiki chrome for read-only reader experience ---- */
.vector-page-toolbar,.vector-page-titlebar-toc,.mw-editsection,.vector-page-tools-landmark,
#p-views,#p-cactions,#ca-history,.vector-page-tabs,.wikibase-edittoolbar-container,
.mw-indicators,#siteNotice,.ext-discussiontools-init-section{display:none!important;}

/* =========================== Main Page bespoke =========================== */
.faylasof-hero{background:linear-gradient(160deg,var(--ink-deep),var(--ink-deep-2) 70%);color:var(--on-dark);
  border-radius:22px;padding:clamp(36px,7vw,72px) 24px;text-align:center;box-shadow:var(--shadow-md);
  border:1px solid rgba(216,189,121,.25);position:relative;overflow:hidden;}
.faylasof-hero::after{content:"";position:absolute;inset:auto -10% -40% -10%;height:60%;
  background:radial-gradient(60% 100% at 50% 0,rgba(10,143,94,.35),transparent 70%);}
.faylasof-mark{font-family:var(--font-display)!important;font-weight:700;font-size:clamp(3rem,9vw,5.5rem);
  color:#fff;line-height:1;text-shadow:0 2px 24px rgba(0,0,0,.4);}
.faylasof-tagline{color:var(--on-dark-soft)!important;font-size:clamp(1rem,2.4vw,1.35rem);margin-top:.8rem;}
.faylasof-cta a,.faylasof-cta{display:inline-block;margin-top:1.6rem;background:var(--gold)!important;color:#20160a!important;
  font-weight:800;padding:13px 30px;border-radius:999px;text-decoration:none!important;box-shadow:0 10px 24px -10px rgba(176,137,47,.7);}
.faylasof-cta a:hover{background:var(--gold-soft)!important;color:#20160a!important;}

.fy-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:22px 0 8px;}
.fy-chip{background:var(--paper-card);border:1px solid var(--paper-edge);border-radius:999px;
  padding:7px 16px;font-size:.92rem;color:var(--ink-soft);box-shadow:var(--shadow-sm);}

.fy-section-title{font-family:var(--font-display)!important;font-size:clamp(1.5rem,4vw,2.1rem);font-weight:700;
  color:var(--emerald-deep);text-align:center;margin:40px 0 6px;}
.fy-section-title::after{content:"";display:block;width:60px;height:3px;margin:.5rem auto 0;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);}

.fy-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:22px 0;}
.fy-tile{background:var(--paper-card);border:1px solid var(--paper-edge);border-radius:var(--radius);
  box-shadow:var(--shadow-sm);transition:transform .18s,box-shadow .18s;}
.fy-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.fy-tile a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 12px;
  color:var(--ink)!important;text-decoration:none!important;font-weight:700;font-size:1.05rem;text-align:center;}
.fy-tile a:hover{color:var(--emerald-deep)!important;}
.fy-ico{font-size:1.8rem;line-height:1;}

.faylasof-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:22px 0;}
.faylasof-card{background:var(--paper-card);border:1px solid var(--paper-edge);border-radius:var(--radius);
  padding:22px 24px;box-shadow:var(--shadow-sm);}
.faylasof-card h3,.faylasof-card .mw-headline{font-family:var(--font-display)!important;color:var(--emerald-deep)!important;}

/* book covers shelf (if present) */
.fy-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:18px;margin:22px 0;}
.fy-book{display:block;text-align:center;text-decoration:none!important;color:var(--ink)!important;}
.fy-book img,.fy-book .fy-cover{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px;
  box-shadow:0 14px 30px -14px rgba(28,20,6,.55);transition:transform .2s;background:var(--emerald-deep);}
.fy-book:hover img,.fy-book:hover .fy-cover{transform:translateY(-4px);}
.fy-book b{display:block;margin-top:10px;font-size:.95rem;line-height:1.4;}

/* =========================== Mobile =========================== */
@media (max-width:768px){
  body{font-size:15px;}
  #content,.mw-body,.mw-parser-output,.wikibase-statementgrouplistview{max-width:100%!important;}
  /* force-stack the whole statement group regardless of flex/float/table layout */
  .wikibase-statementgroupview,.wikibase-statementgroupview-property,.wikibase-statementlistview,
  .wikibase-statementview,.wikibase-statementview-mainsnak,.wikibase-snakview,.wikibase-snakview-value,
  .wikibase-snakview-body{display:block!important;width:100%!important;max-width:100%!important;
    float:none!important;min-width:0!important;box-sizing:border-box!important;}
  .wikibase-statementgroupview-property{border-inline-end:0!important;
    border-bottom:2px solid var(--gold-soft)!important;}
  .wikibase-statementview-mainsnak{word-break:break-word!important;overflow-wrap:anywhere!important;}
  .firstHeading{font-size:1.7rem!important;}
  /* kill any horizontal overflow from wide tables */
  .mw-parser-output table,.wikibase-entitytermsview{display:block;max-width:100%;overflow-x:auto;}
  .wikibase-statementview-mainsnak{word-break:break-word;}
  .faylasof-hero{border-radius:16px;}
}
* { -webkit-tap-highlight-color: transparent; }