فراغیب

مدیاویکی:Common.css: تفاوت میان نسخه‌ها

→ تفاوت با ویرایش قدیمی‌تر
جایگزینی صفحه با '←--------------------- Begin Font Style -----------------: @font-face { font-family: 'IRANSansXFaNum'; font-style: normal; font-weight: 400; font-display: swap; src: url('/w/resources/fonts/IRANSansXFaNum-Regular.woff2') format('woff2'), url('/w/resources/fonts/IRANSansXFaNum-Regular.woff') format('woff'); } ←فونت اصلی بدنه: body { font-family: 'IRANSansXFaNum', Tahoma, 'Noto Serif', sans-serif !important...'
برچسب: جایگزین شد
بدون خلاصۀ ویرایش
برچسب: واگردانی دستی
 
(۱۴۵ نسخهٔ میانی ویرایش شده توسط ۲ کاربر نشان داده نشد)
خط ۹: خط ۹:
}
}


/* فونت اصلی بدنه */
body {
body {
     font-family: 'IRANSansXFaNum', Tahoma, 'Noto Serif', sans-serif !important;
     font-family: IRANSansXFaNum !important;
}
}


/* عناوین و بخش‌های مهم */
#content.mw-body h1,
h1, h2, h3, h4, h5, h6,
#content.mw-body h2,
.mw-body h1, .mw-body h2, .mw-body #firstHeading,
#content.mw-body #firstHeading,
.mw-body .mw-editsection, .mw-body .mw-editsection-like,
#content.mw-body .mw-editsection,
.mw-body #toc h2, .mw-body .toc h2,
.mw-body .mw-editsection-like,
#template-documentation, #documentation-meta-data,
#content.mw-body #toc h2,
.vector-sticky-header-context-bar-primary {
#content.mw-body .toc h2,
     font-family: 'Sahel', 'Shabnam', Tahoma, sans-serif !important;
.vector-sticky-header-context-bar-primary,
#template-documentation,
#documentation-meta-data {
     font-family: IRANSansXFaNum !important;
     line-height: 1.6;
     line-height: 1.6;
    font-weight: bold;
}
}


/* ویرایشگرها */
textarea {
textarea, #wpTextbox1, .ve-ui-mwWikitextSurface .ve-ce-attachedRootNode {
     font-family: IRANSansXFaNum !important;
     font-family: 'IRANSansXFaNum', 'Vazir', Tahoma, monospace !important;
    font-size: 15px;
}
}


خط ۳۶: خط ۳۵:
     font-size: 16px;
     font-size: 16px;
     line-height: 2.0;
     line-height: 2.0;
    font-family: IRANSansXFaNum !important;
}
.ace_editor {
    font-family: IRANSansXFaNum !important;
}
}


/* اصلاح نمایش در لایه های رابط کاربری */
.ui-widget,
.ui-widget, .ui-widget *, button, input, select, optgroup {
.ui-widget *,
     font-family: inherit;
button,
input,
select,
optgroup {
     font-family: IRANSansXFaNum !important;
}
}


/* رفع استایل کج برای برخی تگ‌ها */
dfn {
cite, dfn, .rellink, .dablink, .hatnote {
     font-style: inherit;
     font-style: normal !important;
}
}


sup, sub {
sup, sub {
     line-height: 1em;
     line-height: 1em;
}
/* --------------------- End Font Style ----------------- */
/* --------------------- End Font Style ----------------- */
/* --------------------- End Font Style ----------------- */
/* end */
dfn {
    font-style: inherit;  /* Reset default styling for <dfn> */
}
sup, sub {
    line-height: 1em;    /* Reduce line-height for <sup> and <sub> */
}
/* Main page fixes */
body.page-ویکی‌پدیا_صفحه_تمرین #ca-edit,
body.page-ویکی‌پدیا_آشنایی #ca-edit {
    border: 1px dotted #36c;
}
body.page-ویکی‌پدیا_صفحه_تمرین #ca-edit:hover,
body.page-ویکی‌پدیا_آشنایی #ca-edit:hover {
    background: none repeat scroll 0 0 white;
    border-color: transparent;
}
body.page-صفحهٔ_اصلی #mp-topbanner {
  clear: both;
}
}


/* --------------------- صفحه اصلی ----------------- */
body.page-صفحهٔ_اصلی #ca-delete,
body.page-صفحهٔ_اصلی #ca-delete,
body.page-صفحهٔ_اصلی #deleteconfirm,
body.page-صفحهٔ_اصلی #deleteconfirm,
خط ۶۱: خط ۹۵:
body.page-صفحهٔ_اصلی #catlinks,
body.page-صفحهٔ_اصلی #catlinks,
body.page-صفحهٔ_اصلی h1.firstHeading,
body.page-صفحهٔ_اصلی h1.firstHeading,
body.page-صفحهٔ_اصلی #centralNotice,
body.page-درگاه_ورودی #siteSub,
body.page-درگاه_ورودی h1.firstHeading {
    display: none !important;
}
body.page-صفحهٔ_اصلی #ca-history,
body.page-صفحهٔ_اصلی #ca-history,
body.page-صفحهٔ_اصلی #pagehistory,
body.page-صفحهٔ_اصلی #pagehistory {
.rootpage-صفحهٔ_اصلی .firstHeading {
  dis play: none;
     display: none !important;
}
 
/* Make the list of references in [[Template:Reflist]] smaller */
.references-small {
    font-size: 90%;
}
 
/* Highlight clicked reference in blue to help navigation */
ol.references > li:target,
sup.reference:target,
span.citation:target, cite:target {
    background-color: #ecf0fa;
}
 
/* Ensure refs in table headers and the like aren't bold or italic */
sup.reference {
     font-weight: normal;
    font-style: normal;
}
 
/* Styling for citations */
span.citation, cite {
    word-wrap: break-word;
}
 
/* If there is an inline link to a full citation, the full citation will turn blue when the inline link is clicked */
cite:target {
    background-color: #ecf0fa;
}
 
/* For linked citation numbers and document IDs, where the number need not be shown on a screen or a handheld, but should be included in the printed version */
 
@media screen, handheld, projection {
    cite *.printonly {
        display: none;
    }
}
 
/* Style for horizontal lists (separator following item) */
 
.skin-monobook .hlist dl,
.skin-modern .hlist dl,
.skin-vector .hlist dl {
    line-height: 1.5em;
}
/* Style for horizontal lists (separator following item).
  IE8-specific classes are assigned in [[MediaWiki:Common.js/IEFixes.js]].
  @source mediawiki.org/wiki/Snippets/Horizontal_lists
  @revision 5 (2014-02-24)
  @author [[User:Edokter]]
*/
.hlist dl,
.hlist ol,
.hlist ul {
    margin: 0;
    padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
    margin: 0;
    display: inline;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
    display: inline;
}
/* Generate interpuncts */
.hlist dt:after {
    content: ": ";
}
.hlist dd:after,
.hlist li:after {
    content: " •";
    /*font-weight: bold;*/
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
    content: none;
}
/* For IE8 */
.hlist dd.hlist-last-child:after,
.hlist dt.hlist-last-child:after,
.hlist li.hlist-last-child:after {
    content: none;
}
/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
    content: " (";
    font-weight: normal;
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
    content: ") ";
    font-weight: normal;
}
/* For IE8 */
.hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after,
.hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after,
.hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-last-child:after {
    content: ") ";
    font-weight: normal;
}
/* Put ordinals in front of ordered list items */
.hlist ol {
    counter-reset: listitem;
}
.hlist ol > li {
    counter-increment: listitem;
}
.hlist ol > li:before {
    content: " " counter(listitem) " ";
    content: " " counter(listitem, -moz-persian) " ";
    content: " " counter(listitem, persian) " ";
    white-space: nowrap;
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
    content: " (" counter(listitem) " ";
    content: " (" counter(listitem, -moz-persian) " ";
    content: " (" counter(listitem, persian) " ";
}
 
/* فهرست بدون گلوله */
.plainlist ul {
    line-height: inherit;
    list-style: none none;
    margin: 0;
}
.plainlist ul li {
    margin-bottom: 0;
}
 
/* Normal font styling for table row headers with scope="row" tag */
.wikitable.plainrowheaders th[scope=row] {
    font-weight: normal;
    /* @noflip */
    text-align: right;
}
/* Lists in data cells are always left-aligned */
.wikitable td ul,
.wikitable td ol,
.wikitable td dl {
    /* @noflip */
    text-align: right;
}
/* ...unless they also use the hlist class */
.wikitable.hlist td ul,
.wikitable.hlist td ol,
.wikitable.hlist td dl {
    text-align: inherit;
}
}


/* --------------------- جعبه‌ها و جداول ----------------- */
/* Default style for navigation boxes */
.navbox {
.navbox {                     /* Navbox container style */
     box-sizing: border-box;
     box-sizing: border-box;
     border: 1px solid #a2a9b1;
     border: 1px solid #a2a9b1;
     width: auto !important;
     width: 100%;
     margin: auto;
     margin: auto;
     clear: both;
     clear: both;
خط ۷۷: خط ۲۸۰:
     text-align: center;
     text-align: center;
     padding: 1px;
     padding: 1px;
     background: #f8f9fa;
}
.navbox-inner,
.navbox-subgroup {
    width: 100%;
}
.navbox-group,
.navbox-title,
.navbox-abovebelow {
    padding: 0.25em 1em;      /* Title, group and above/below styles */
    line-height: 1.5em;
    text-align: center;
}
th.navbox-group {            /* Group style */
    white-space: nowrap;
    /* @noflip */
    text-align: right;
}
.navbox,
.navbox-subgroup {
     background: #f8f9fa;      /* Background color */
}
.navbox-list {
    line-height: 1.8em;
    border-color: #f8f9fa;    /* Must match background color */
}
.navbox th,
.navbox-title {
    background: #b3ccff;      /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
    background: #dbe7ff;      /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #e5edff;      /* Level 3 color */
}
.navbox-even {
    background: #f8f9fa;      /* Even row striping */
}
.navbox-odd {
    background: transparent;  /* Odd row striping */
}
table.navbox + table.navbox {  /* Single pixel border between adjacent navboxes */
    margin-top: -1px;          /* (doesn't work for IE6, but that's okay)      */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
    padding: 0.125em 0;      /* Adjust hlist padding in navboxes */
}
ol + table.navbox,
ul + table.navbox {
    margin-top: 0.5em;        /* Prevent lists from clinging to navboxes */
}
 
/* RTL fix for navbox-list bullet lists; See [[Special:Permalink/24864265#خطای ظاهری]]. */
.navbox-list li {
    unicode-bidi: isolate;
}
 
/* Default styling for Navbar template */
.navbar {
    display: inline;
    font-size: 88%;
    font-weight: normal;
}
.navbar ul {
    display: inline;
    white-space: nowrap;
}
.navbar li {
    word-spacing: -0.125em;
}
.navbar.mini li { /* span is removed */
    font-size: xx-small;
}
.nv-talk > a {
    color: #002BB8;
}
/* Navbar styling when nested in infobox and navbox */
.infobox .navbar {
    font-size: 100%;
}
.navbox .navbar {
    display: block;
    font-size: 100%;
}
.navbox-title .navbar {
    /* @noflip */
    float: right;
    /* @noflip */
    text-align: right;
    /* @noflip */
    margin-left: 0.5em;
    width: 6em;
}
 
/* 'show'/'hide' buttons created dynamically by the CollapsibleTables javascript
  in [[MediaWiki:Common.js]] are styled here so they can be customised. */
.collapseButton {
    /* @noflip */
    float: left;
    font-weight: normal;
    /* @noflip */
    margin-right: 0.5em;
    /* @noflip */
    text-align: left;
    width: auto;
}
/* In navboxes, the show/hide button balances the v·d·e links
  from [[Template:Navbar]], so they need to be the same width. */
.navbox .collapseButton {
    width: 6em;
}
}


/* Infobox template style */
.infobox {
.infobox {
     border: 1px solid #a2a9b1;
     border: 1px solid #a2a9b1;
     background-color: #f8f9fa;
     background-color: #f8f9fa;
    color: black;
    /* @noflip */
     margin: 0.5em 1em 0.5em 0;
     margin: 0.5em 1em 0.5em 0;
     padding: 0.2em;
     padding: 0.2em;
    /* @noflip */
     float: left;
     float: left;
    /* @noflip */
     clear: left;
     clear: left;
    /* @noflip */
     text-align: right;
     text-align: right;
     font-size: 88%;
     font-size: 88%;
     line-height: 1.5em;
     line-height: 1.5em;
    /* added */
     max-width: 25%;
     max-width: 25%;
}
.infobox caption {
    font-size: 125%;
    font-weight: bold;
}
.infobox td,
.infobox th {
    vertical-align: top;
}
.infobox.bordered {
    border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
    border: 1px solid #a2a9b1;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
    border: 0;
}
.infobox.sisterproject {
    width: 20em;
    font-size: 90%;
}
.infobox.standard-talk {
    border: 1px solid #d2ad76;
    background-color: #fff2cc;
}
.infobox.standard-talk.bordered td,
.infobox.standard-talk.bordered th {
    border: 1px solid #d2ad76;
}
/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
    border: 0;
    border-top: 1px solid #a2a9b1;
    /* @noflip */
    border-left: 1px solid #a2a9b1;
}
.infobox.bordered .mergedrow td,
.infobox.bordered .mergedrow th {
    border: 0;
    border-left: 1px solid #a2a9b1;
}
/* Styles for geography infoboxes, eg countries,
  country subdivisions, cities, etc.            */
.infobox.geography {
    text-align: right;
    border-collapse: collapse;
    line-height: 1.2em;
    font-size: 90%;
}
.infobox.geography caption { /* کمی فاصله بیشتر برای عنوان */
    line-height: 1.6em;
}
.infobox.geography  td,
.infobox.geography  th {
    border-top: 1px solid #a2a9b1;
    padding: 0.4em 0.6em 0.4em 0.6em;
}
.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th {
    border-top: 1px solid #a2a9b1;
    padding: 0.4em 0.6em 0.2em 0.6em;
}
.infobox.geography .mergedrow td,
.infobox.geography .mergedrow th {
    border: 0;
    padding: 0 0.6em 0.2em 0.6em;
}
.infobox.geography .mergedbottomrow td,
.infobox.geography .mergedbottomrow th {
    border-top: 0;
    border-bottom: 1px solid #a2a9b1;
    padding: 0 0.6em 0.4em 0.6em;
}
.infobox.geography .maptable td,
.infobox.geography .maptable th {
    border: 0;
    padding: 0;
}
/* Style for "notices" */
.notice {
    margin: 1em;
    padding: 0.2em;
}
#disambig {
    border-top: 1px solid #c8ccd1;
    border-bottom: 1px solid #c8ccd1;
}
.notice-text, .toggle-box, .red-button, .goal, div.red-button, div.siteNoticeSmall, div#siteNotice {
  font-family: inherit;
}
DIV.siteNoticeSmall {
  font-size: 15pt;
}
}


/* اصلاح نمایش لیست‌های افقی */
/* Persondata and other (future) metadata */
.hlist dt:after { content: ": "; }
table.InChI, /* temporary */
.hlist dd:after, .hlist li:after { content: " •"; }
table.persondata {
.hlist dd:last-child:after, .hlist dt:last-child:after, .hlist li:last-child:after { content: none; }
    border: 1px solid #a2a9b1;
    display: none;
    speak: none;
}
.InChI-label, /* temporary */
.persondata-label {
    color: #a2a9b1;
}


/* --------------------- اصلاحات موبایل ----------------- */
/* Icons for medialist templates [[Template:Listen]], [[Template:Multi-listen_start]], [[Template:Video]], [[Template:Multi-video_start]] */
div.listenlist {
    background: url("//upload.wikimedia.org/wikipedia/commons/3/3f/Gnome_speakernotes_30px.png");
    /* @noflip */
    padding-right: 40px;
}
 
div.videolist, div.multivideolist {
    background: url("//upload.wikimedia.org/wikipedia/commons/thumb/2/20/Tango-video-x-generic.png/40px-Tango-video-x-generic.png");
    padding-right: 50px;
}
 
/* Change the external link icon to an Adobe icon for all PDF files
  in browsers that support these CSS selectors, like Mozilla and Opera */
.mw-body a[href$=".pdf"].external,
.mw-body a[href*=".pdf?"].external,
.mw-body a[href*=".pdf#"].external,
.mw-body a[href$=".PDF"].external,
.mw-body a[href*=".PDF?"].external,
.mw-body a[href*=".PDF#"].external,
div#mw_content a[href$=".pdf"].external,
div#mw_content a[href*=".pdf?"].external,
div#mw_content a[href*=".pdf#"].external,
div#mw_content a[href$=".PDF"].external,
div#mw_content a[href*=".PDF?"].external,
div#mw_content a[href*=".PDF#"].external {
    background: url("//upload.wikimedia.org/wikipedia/commons/2/23/Icons-mini-file_acrobat.gif") no-repeat left;
    /* @noflip */
    padding-left: 18px;
}
 
/* Change the external link icon to an Adobe icon anywhere the PDFlink class */
/* is used (notably Template:PDFlink). This works in IE, unlike the above. */
span.PDFlink a {
    background: url("//upload.wikimedia.org/wikipedia/commons/2/23/Icons-mini-file_acrobat.gif") center left no-repeat !important;
    padding-left: 18px !important;
}
 
span.geolink a {
    background: url(//upload.wikimedia.org/wikipedia/en/a/a7/Monobook-globe.png) center left no-repeat !important;
    padding-left: 11px !important;
}
 
/* Content in columns with CSS instead of tables [[Template:Columns]] */
div.columns-2 div.column {
    /* @noflip */
    float: right;
    width: 50%;
    min-width: 300px;
}
 
div.columns-3 div.column {
    /* @noflip */
    float: right;
    width: 33.3%;
    min-width: 200px;
}
 
div.columns-4 div.column {
    /* @noflip */
    float: right;
    width: 25%;
    min-width: 150px;
}
 
div.columns-5 div.column {
    /* @noflip */
    float: right;
    width: 20%;
    min-width: 120px;
}
 
/*Add formatting to make sure that "external references" from [[Template:Ref]] do
  not get URL expansion, not even when printed. The mechanism up to MediaWiki 1.4 was
  that the HTML code contained a SPAN following the anchor A; this SPAN had the class
  "urlexpansion", which was not displayed on screen, but was shown when the medium was
  "print". The rules below ensure (a) that there is no extra padding to the left of
  the anchor (displayed as "[<number>]"), (b) that there is no "external link arrow" for
  the link, and (c) that this SPAN of class "urlexpansion" is never shown.
*/
 
.plainlinksneverexpand {
    background: none ! important;
    padding: 0 ! important;
}
 
.plainlinksneverexpand .urlexpansion {
    display: none ! important;
}
 
/* Make sure that ext links displayed within "plainlinksneverexpand" don't get
  the arrow...
*/
.plainlinksneverexpand a {
    background: none !important;
    padding: 0 !important;
}
 
/* Messagebox templates */
.messagebox {
    border: 1px solid #a2a9b1;
    background-color: #f8f9fa;
    width: 80%;
    margin: 0 auto 1em auto;
    padding: .2em;
}
.messagebox.merge {
    border: 1px solid #c0b8cc;
    background-color: #f0e5ff;
    text-align: center;
}
.messagebox.cleanup {
    border: 1px solid #9f9fff;
    background-color: #efefff;
    text-align: center;
}
.messagebox.standard-talk {
    border: 1px solid #c0c090;
    background-color: #f8eaba;
}
.messagebox.nested-talk {
    border: 1px solid #c0c090;
    background-color: #f8eaba;
    width: 100%;
    margin: 2px 4px 2px 4px;
}
.messagebox.small {
    width: 238px;
    font-size: 85%;
    /* @noflip */
    float: left;
    clear: both;
    /* @noflip */
    margin: 0 0 1em 1em;
    line-height: 1.25em;
}
.messagebox.small-talk {
    width: 238px;
    font-size: 85%;
    /* @noflip */
    float: left;
    clear: both;
    /* @noflip */
    margin: 0 0 1em 1em;
    line-height: 1.25em;
    background: #fff2cc;
}
 
/* Article message box styles */
table.ambox {
    margin: 0px 10%;                  /* 10% = Will not overlap with other elements */
    border: 1px solid #a2a9b1;
    border-right: 10px solid #36c;  /* Default "notice" blue */
    background: #f8f9fa;
}
table.ambox + table.ambox {      /* Single border between stacked boxes. */
    margin-top: -1px;
}
.ambox th.mbox-text,
.ambox td.mbox-text {            /* The message body cell(s) */
    padding: 0.25em 0.5em;      /* 0.5em left/right */
}
.ambox td.mbox-image {          /* The left image cell */
    padding: 2px 0.5em 2px 0;    /* 0.5em right, 0px left */
}
.ambox td.mbox-imageright {      /* The right image cell */
    padding: 2px 0 2px 0.5em;    /* 0px right, 0.5em left */
}
table.ambox-notice {
    border-right: 10px solid #36c;    /* Blue */
}
table.ambox-speedy {
    border-right: 10px solid #DD0000;    /* Red */
    background: #fee7e6;                  /* Pink */
}
table.ambox-delete {
    border-right: 10px solid #DD0000;    /* Red */
}
table.ambox-content {
    border-right: 10px solid #FF5D00;    /* Orange */
}
table.ambox-style {
    border-right: 10px solid #fc3;    /* Yellow */
}
table.ambox-move {
    border-right: 10px solid #9932cc;    /* Purple */
}
table.ambox-protection {
    border-right: 10px solid #a2a9b1;      /* Gray-gold */
}
 
/* Disambig and set index box styles */
table.dmbox {
    clear: both;
    margin: 0.9em 1em;
    border-top: 1px solid #c8ccd1;
    border-bottom: 1px solid #c8ccd1;
    background: transparent;
}
/* Footer and header message box styles */
table.fmbox {
    clear: both;
    margin: 0.2em 0;
    width: 100%;
    border: 1px solid #a2a9b1;
    background: #f8f9fa;    /* Default "system" gray */
}
table.fmbox-system {
    background: #f8f9fa;
}
table.fmbox-warning {
    border: 1px solid #DD0000;  /* Dark pink */
    background: #fee7e6;        /* Pink */
}
table.fmbox-editnotice {
    background: transparent;
}
/* Div based "warning" style fmbox messages. */
div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div#mw-protect-cascadeon {
    clear: both;
    margin: 0.2em 0;
    border: 1px solid #DD0000;
    background: #fee7e6;
    padding: 0.25em 0.9em;
}
/* Div based "system" style fmbox messages.
  Used in [[MediaWiki:Readonly lag]]. */
div.mw-lag-warn-normal,
div.fmbox-system {
    clear: both;
    margin: 0.2em 0;
    border: 1px solid #a2a9b1;
    background: #f8f9fa;
    padding: 0.25em 0.9em;
}
/* These mbox-small classes must be placed after all other
  ambox/tmbox/ombox etc classes. "body.mediawiki" is so
  they override "table.ambox + table.ambox" above. */
body.mediawiki table.mbox-small {  /* For the "small=yes" option. */
    /* @noflip */
    clear: left;
    /* @noflip */
    float: left;
    /* @noflip */
    margin: 4px 1em 4px 0;
    width: 238px;
    font-size: 88%;
    line-height: 1.25em;
}
body.mediawiki table.mbox-small-right {  /* For the "small=right" option. */
    /* @noflip */
    margin: 4px 0 4px 1em;
    width: 238px;
    border-collapse: collapse;
    font-size: 88%;
    line-height: 1.25em;
}
 
/* Put a checker background at the image description page only visible if the image has transparent background */
#file img {
    background: url("//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png") repeat;
}
 
#wpSave {
    font-weight: bold;
}
 
/* suppress missing interwiki image links where #ifexist cannot be used due to high number of requests */
/* use restricted to rail icon management pages */
/* see .hidden-redlink on //meta.wikimedia.org/wiki/MediaWiki:Common.css */
.check-icon a.new {
    display: none;
    speak:none;
}
 
/* Removes underlines from links */
.nounderlines a {
    text-decoration: none;
}
 
/* Remove underline from IPA links */
.IPA a:link, .IPA a:visited {
    text-decoration: none;
}
 
/* Removes useless links from printout */
@media print {
    #privacy, #about, #disclaimer {display:none;}
}
 
#EnWpMpBook { background-image: url(//upload.wikimedia.org/wikipedia/en/7/7e/MP-open-book.png); }
#EnWpMpSearch { background: url(//upload.wikimedia.org/wikipedia/en/a/ae/MP-magnifying-glass.png) no-repeat top left; }
#EnWpMpSearchInner { float: left; width: 20em; text-align: center; }
#EnWpMpBook2 { background-image: url(//upload.wikimedia.org/wikipedia/commons/8/8e/MP-open-book2.png); }
 
/* Standard Navigationsleisten, aka box hiding thingy from .de.  Documentation at [[Wikipedia:NavFrame]]. */
 
div.Boxmerge,
div.NavFrame {
    margin: 0px;
    padding: 4px;
    border: 1px solid #a2a9b1;
    text-align: center;
    border-collapse: collapse;
    font-size: 95%;
}
div.Boxmerge div.NavFrame {
    border-style: none;
    border-style: hidden;
}
div.NavFrame + div.NavFrame {
    border-top-style: none;
    border-top-style: hidden;
}
div.NavPic {
    background-color: #fff;
    margin: 0px;
    padding: 2px;
    float: right;
}
div.NavFrame div.NavHead {
    height: 1.6em;
    font-weight: bold;
    background-color: #b3ccff;
    position:relative;
}
div.NavFrame div.NavHead:hover {
        background-color: #aaf;
}
div.NavFrame p {
    font-size: 100%;
}
div.NavFrame div.NavContent {
    font-size: 100%;
}
div.NavFrame div.NavContent p {
    font-size: 100%;
}
div.NavEnd {
    margin: 0px;
    padding: 0px;
    line-height: 1px;
    clear: both;
}
a.NavToggle {
    position:absolute;
    top:0px;
    left:3px;
    font-weight:normal;
    font-size:smaller;
}
 
/* Hatnotes and disambiguation notices */
.rellink,
.dablink,
.hatnote {
    font-style: italic;
}
.rellink i,
.dablink i,
.hatnote i {
    font-style: normal;
}
div.rellink,
div.dablink,
div.hatnote {
    /* @noflip */
    padding-right: 1.6em;
    margin-bottom: 0.5em;
}
 
span.updatedmarker {
    background-color: transparent;
    color: #006400;
}
 
/* Coloured watchlist numbers */
.mw-plusminus-pos {
    color: #006400; /* darkgreen */
}
 
/* .mw-plusminus-null currently at developer default */
 
.mw-plusminus-neg {
    color: #8B0000; /* darkred */
}
 
.dablink {
    font-style: italic;
    padding-right: 2em;
}
 
.dablink i {
    font-style: normal;
}
 
/* Style for horizontal UL lists */
.horizontal ul {
    padding: 0;
    margin: 0;
}
 
.horizontal li {
    padding: 0 0.6em 0 0.4em;
    display: inline;
    border-left: 1px solid;
}
 
/* Geographical coordinates
 
To display coordinates using the notation in the source code, write this in your User:Username/monobook.css:
  .geo-default { display: inline } .geo-nondefault { display: none }
  .geo-dec { display: inline } .geo-dms { display: inline }
 
To display coordinates using decimal notation, write this in your User:Username/monobook.css:
  .geo-default { display: inline } .geo-nondefault { display: inline }
  .geo-dec { display: inline } .geo-dms { display: none }
 
To display coordinates using DMS notation, write this in your User:Username/monobook.css:
  .geo-default { display: inline } .geo-nondefault { display: inline }
  .geo-dec { display: none }  .geo-dms { display: inline }
 
To display coordinates in both decimal and DMS notation, write this in your User:Username/monobook.css:
  .geo-default { display: inline } .geo-nondefault { display: inline }
  .geo-dec { display: inline }  .geo-dms { display: inline }
  .geo-multi-punct { display: inline }
 
See [[Template:Coor link]] for how these are used.
 
Note that the classes "geo", "longitude", and "latitude" are not just styles but also used by the [[Geo microformat]], so the names should not be changed.
 
*/
 
.geo-default { display: inline; }
.geo-nondefault { display: none; }
.geo-dms { display: inline; }
.geo-dec { display: inline; }
.geo-multi-punct { display: none; }
 
.longitude .latitude {
    white-space: nowrap;
}
 
/* This is used for the Geo microformat, but no style is needed for now other than .geo-dec. */
.geo { }
 
/***** end Geo-related */
 
/* When <div class="nonumtoc"> is used on the table of contents, the ToC will display without numbers */
.nonumtoc .tocnumber { display:none; }
.nonumtoc #toc ul,
.nonumtoc .toc ul {
    line-height: 1.5em;
    list-style: none;
    margin: .3em 0 0;
    padding: 0;
}
.nonumtoc #toc ul ul,
.nonumtoc .toc ul ul {
    margin: 0 0 0 2em;
}
 
/* Allow limiting of which header levels are shown in a TOC; <div class="toclimit-3">, for
  instance, will limit to showing ==headings== and ===headings=== but no further (as long as
  there are no =headings= on the page, which there shouldn't be according to the MoS). */
.toclimit-2 .toclevel-2 {display:none;}
.toclimit-3 .toclevel-3 {display:none;}
.toclimit-4 .toclevel-4 {display:none;}
.toclimit-5 .toclevel-5 {display:none;}
.toclimit-6 .toclevel-6 {display:none;}
.toclimit-7 .toclevel-7 {display:none;}
 
/* Allow transcluded pages to display in lists rather than a table. Compatible in Firefox; incompatible in IE6. */
.listify td {display:list-item;}
.listify tr {display:block;}
.listify table {display:block;}
 
div.user-block {
    padding: 5px;
    border: 1px solid #a2a9b1;
    background-color: #fee7e6;
}
/* Prevent line breaks in silly places:
  1) links when we don't want them to
  2) HTML formulae
  3) Ref tags with group names <ref group="Note"> --> "[Note 1]"
*/
.nowrap,
.nowraplinks a,
span.texhtml,
sup.reference a { white-space: nowrap; }
 
/* Contents of <math> tag should have an ltr layout */
span.texhtml {
    direction:ltr;
    unicode-bidi:bidi-override;
}
 
.thumbinner {
    min-width: 100px;
}
 
/* Cell sizes for ambox/tmbox/imbox/cmbox/ombox/fmbox/dmbox message boxes */
th.mbox-text, td.mbox-text {    /* The message body cell(s) */
    border: none;
    padding: 0.25em 0.9em;      /* 0.9em left/right */
    width: 100%;    /* Make all mboxes the same width regardless of text length */
}
td.mbox-image {                  /* The left image cell */
    border: none;
    padding: 2px 0.9em 2px 0px;    /* 0.9em right, 0px left */
    text-align: center;
}
td.mbox-imageright {            /* The right image cell */
    border: none;
    padding: 2px 0px 2px 0.9em;    /* 0px left, 0.9em right */
    text-align: center;
}
/* Reduce line-height for <sup> and <sub> */
sup, sub {
    line-height: 1em;
}
/* Styling for Abuse Filter tags */
.mw-tag-markers {
font-style:italic;
font-size:90%;
}
 
/* Für <nowiki><hiero>…</hiero></nowiki> */
.mw-hierotable, .hierotable-mw,
.mw-hierotable  th, .hierotable mw-th,
.mw-hierotable  td, .hierotable mw-td {
    border: 0px;
    padding: 0px;
}
/* With MediaWiki 1.5, the mechanism has changed: instead of a SPAN of class "urlexpansion"
  following the anchor A, the anchor itself now has class "external autonumber" and the
  expansion is inserted when printing (see the common printing style sheet at
  //en.wikipedia.org/w/skins/common/commonPrint.css) using the ":after" pseudo-
  element of CSS. We have to switch this off for links due to Template:Ref!
*/
.plainlinksneverexpand a.external.text:after {
    display: none !important;
}
.plainlinksneverexpand a.external.autonumber:after {
    display: none !important;
}
/* for Main Page */
.globegris {
  background: url(//upload.wikimedia.org/wikipedia/commons/1/10/Wikipedia-logo-v2-200px-transparent.png);
}
/* End */
 
.prefsection fieldset {
        float: right;
}
 
/* Small font-size for hidden categories */
#mw-hidden-catlinks { font-size: 87% !important; }
 
.listify {
  margin-left:0;
  margin-right:2em;
}
#wpFilterRules {
  direction: ltr;
}
 
/* این نیز باگ است که وقتی عنوان یک بخش انگلیسی است، فارسی درون خلاصه ویرایش در تاریخچه به هم می‌ریزد */
.comment > span { unicode-bidi: normal; }
 
/* نمایش بهتر خلاصه ویرایش‌های خیلی طولانی */
.comment {
overflow-wrap: break-word;
word-break: break-word ;
}
 
/* زیاد کردن اندازه توضیحات صفحه بارگذاری */
#wpUploadDescription {
  height: 25em;
}
 
/*ابزار پررنگ کننده نظرهای کاربر*/
.mycomment { background: #ff9; }
 
/* Pie chart test: Transparent borders */
.transborder {
    border: solid transparent;
}
 
/* Hide edittools base for those not using the gadget */
#mw-edittools-charinsert {
    display: none;
}
 
/* Category tree styling. Works in conjuction with [[MediaWiki:Categorytree-expand-bullet]],
  [[MediaWiki:Categorytree-collapse-bullet]] and [[MediaWiki:Categorytree-empty-bullet]]. */
#mw-subcategories ul {
    list-style: none none;
    margin-left: 0.25em;
}
.CategoryTreeChildren {
    margin-left: 1.25em;
}
.CategoryTreeToggle {
    color: #36c;
}
.CategoryTreeEmptyBullet {
    color: #c8ccd1;
}
 
/* توضیح به کاربران درباره صفحه تمرین */
body.ns-2[class*="_صفحه_تمرین"] #firstHeading::after {
    color: #72777d;
    content: "توجه:این صفحه بخشی از دانشنامه نیست.";
    float: left;
    width: 40%;
    font-size: 40%;
}
 
/*اصلاح اندازه فونت در تغییرات اخیر برای [ویرایش‌های در حال انتظار] برگرفته از ویکی‌روسی*/
.mw-fr-reviewlink, .fr-hist-basic-user, .fr-hist-basic-auto {
    font-weight: normal;
    font-size: smaller;
}
 
/* temporary fix for T86979 */
.ui-dialog { right: auto; }
 
/* Make it possible to hide checkboxes in <inputbox> */
.inputbox-hidecheckboxes form .inputbox-element {
    display: none !important;
}
 
/* این برچسپ بهتر است فقط برای Gadget-taghighlighter.css را فعال کرده اند دیده شوند */
.mw-tag-marker-نیازمند_بازبینی { display: none; }
 
/* Reduce page jumps by hiding collapsed/dismissed content */
.client-js .mw-special-Watchlist #watchlist-message {
    display: none;
}
 
/* کمی پیوند ایجاد مقاله بزرگتر شود که پس از حذف بیشتر استفاده شود */
.mw-warning-with-logexcerpt a[title="ویکی‌پدیا:ایجاد مقاله"] { font-size: 120%; font-weight: bold; }
 
/* Make the textarea pink when an admin is editing a protected page */
.mw-textarea-protected {
    background-color: #fee7e6;
}
 
/* Made diffs use Wikimedia UI color palette ([[phab:M82]]) */
td.diff-addedline {
    border-color: #36c;
}
td.diff-deletedline {
    border-color: #fc3;
}
td.diff-addedline .diffchange {
    background: #e9eef9;
}
td.diff-deletedline .diffchange {
    background: #fff4d6;
}
 
/* Spacing between the rows of navbox */
tr + tr > .navbox-abovebelow,
tr + tr > .navbox-group,
tr + tr > .navbox-image,
tr + tr > .navbox-list {    /* Borders above 2nd, 3rd, etc. rows */
    border-top: 2px solid #fdfdfd; /* Must match background color */
}
/* End of Spacing between the rows of navbox */
 
/* Color diff links */
.mw-diff-edit a {
color: #2a4b8d;
}
 
.mw-diff-undo a, .mw-history-undo a, .mw-rollback-link a {
color: #d33;
}
 
a.mw-thanks-thank-link {
color: #14866d;
}
 
/* Make sure cite and dfn are not italicized thorugh the user agent stylesheet */
cite, dfn {
font-style:inherit;
}
 
/* LTR citations should be listed LTR and be left-aligned, as is the case in Persian literature */
LI.mw-cite-dir-ltr {
  direction: ltr;
  margin-left: 2.3em;
  text-align: left;
  list-style-type: decimal !important;
}
 
/* OL with Persian alphabet used for its counter */
@counter-style persian-alpha {
  system: cyclic;
  symbols: "\627\644\641" "\628" "\67E" "\62A" "\62B" "\62C" "\684" "\62D" "\62E" "\62F" "\630" "\631" "\632" "\698" "\633" "\634" "\635" "\636" "\637" "\638" "\639" "\63A" "\641" "\642" "\6A9" "\6AB" "\644" "\645" "\646" "\648" "\6BE" "\6CC";
  suffix = " ";
}
 
.reflist-persian-alpha ol:lang( fa ) li {
  list-style-type: persian-alpha !important;
  direction: rtl;
  text-align: right;
  margin-left: 0;
}
 
/* Right margin for left-aligned tables */
table[align="left"] {
margin-right: 1.2em;
}
 
/* Center aligning wikitables should be as easy as using align=center */
table.wikitable[align="center"] {
  margin-right: auto;
  margin-left: auto;
}
 
.mw-indicator, .mw-helplink, .mw-indicator-pp-default {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* For portals, added 2011-12-07 -bv
  On wide screens, show these as two columns
  On narrow and mobile screens, let them collapse into a single column */
.mainpage-portals {
float: right;
width: 14.2%;
margin: 12px auto;
}
.portal-container-2 {
display: grid;
grid-gap: 15px;
grid-template-columns: repeat(2, auto);
grid-template-rows: auto; 
width: 100%
}
.portal-container-3 {
display: grid;
grid-gap: 15px;
grid-template-columns: repeat(3, auto);
grid-template-rows: auto; 
width: 100%
}
.portal-container-4 {
display: grid;
grid-gap: 15px;
grid-template-columns: repeat(4, auto);
grid-template-rows: auto; 
width: 100%
}
.portal-container-5 {
display: grid;
grid-gap: 15px;
grid-template-columns: repeat(5, auto);
grid-template-rows: auto; 
width: 100%
}
.portal-container-6 {
display: grid;
grid-gap: 15px;
grid-template-columns: repeat(6, auto);
grid-template-rows: auto; 
width: 100%
}
.portal-container-7 {
display: grid;
grid-gap: 15px;
grid-template-columns: repeat(7, auto);
grid-template-rows: auto; 
width: 100%
}
.portal-column-2-3 {
grid-column-end: span 2;
}
.portal-column-2-4 {
grid-column-end: span 2;
}
.portal-column-3-4 {
grid-column-end: span 3;
}
.portal-column-1-2,
.portal-column-1-3,
.portal-column-1-4,
.portal-column-1-5,
.portal-column-1-6,
.portal-column-1-7 {
grid-column-end: span 1;
}
.portal-column-2-2 {
grid-column-end: span 2;
}
.portal-column-3-3 {
grid-column-end: span 3;
}
.portal-column-4-4 {
grid-column-end: span 4;
}
.portal-column-5-5 {
grid-column-end: span 5;
}
.portal-column-6-6 {
grid-column-end: span 6;
}
.portal-column-7-7 {
grid-column-end: span 7;
}
@media only screen and (max-width: 700px) {
@media only screen and (max-width: 700px) {
    .mainpage-portals { width: 100%; }
.mainpage-portals {
     .portal-container-2, .portal-container-3, .portal-container-4 {
width: 25%;  
         display: block;
}
    /* Decouple the columns on narrow screens */
     .portal-container-2,
    .portal-container-3,  
    .portal-container-4,
    .portal-container-5,
    .portal-container-6,
    .portal-container-7 {
display: block;
}
    .portal-column-1-2,
    .portal-column-2-4,
    .portal-column-3-4,
    .portal-column-1-3,
    .portal-column-2-3,
    .portal-column-2-2,
    .portal-column-3-3,
.portal-column-4-4,
.portal-column-5-5,
.portal-column-6-6,
.portal-column-7-7 {
        flo at: inherit;
        wid th: 100%;
        margin-top: 16px;
         display: block !important;
        text-align: center;
    }
    .portal-column-1-4 {
wid th: calc(50% - 16px);
    }
    .portal-column-1-6 {
wid th: calc(33.3% - 16px);
     }
     }
     .infobox, .sidebar, .quotebox {
     .portal-column-1-7 {
        max-width: 100% !important;
flo at: right;
        float: none !important;
wid th: calc(25% - 16px);
        width: 100% !important;
     }
     }
}
@media only screen and (max-width: 600px) {
    .portal-column-1-4,
    .portal-column-1-6,
    .portal-column-1-5 {
        float: inherit;
        width: 100%;
        margin: 0;
        display: block !important;
        text-align: center;
    }
}
/* temporary fix for T86979 */
.ui-dialog { right: auto; }
/* wikipedia styles with unknown origin! */
.mw-body-content blockquote {
border-right:4px solid #eaecf0;
padding:8px 32px
}
/* طراحی صفحه اول */
.mainpage-top {
    background-image: url(/mainpage-top-2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
background-position-y: 60%;
background-position-x: center;
}
.rootpage-صفحهٔ_اصلی .firstHeading {
display: none;
}
/* عنوان جعبه ها */
.mainpage-box .heading {
    background-image: url(/background-3.png);
}
/* فیدبک */
.page-صفحهٔ_اصلی .articleFeedbackv5 {
    display: none
}
#mw-articlefeedbackv5 {
max-width: 100%;
width: auto !important;
}
.articleFeedbackv5 {
font-size: 80%;
}
.articleFeedbackv5-panel{
max-width: 100%;
}
.articleFeedbackv5-tooltip-trigger {
    display:none
}
.articleFeedbackv5-title {
    margin-top:0 !important
}
.feedback-text {
height: 6em !important;
margin-bottom: 12px;
}
.articleFeedbackv5-disclosure {
    display:none
}
.articleFeedbackv5-submit {
    float:left !important;
}
.articleFeedbackv5-cta-5 {
display: none;
}
.page-صفحهٔ_اصلی #content{
padding-top: 0;
}
/* مخفی کردن از بازدید کننده ها */
.showtologgedin {
    display: none
}
/* navbox */
.navbox {
    width: auto !important
}
/* side bar
#mw-panel{
posi tion: fixed;
    z-index: 100;
    /* background-color: #fefdf9; */
    width: 10.5em;
    overflow: auto;
}*/
/* navbox */
.navbox-title a {
color: black !important;;
text-decoration: underline;
}
.nv-talk {
display: none !important;
}
/* font-sizes */
.mw-body-content{
font-size: 16px;
}
.mw-editfont-monospace{
font-size: 15px;
}
img {
max-width: 100%;
height: auto !important;
    clip: rect(auto, auto, auto, auto) !important;
}
/*
* New image thumb design
*
* @dependencies none
* @source en.wikipedia.org/wiki/MediaWiki:Gadget-NewImageThumb.css
* @revision 2
* @author: Edokter ([[User:Edokter]])
*/
.tocnumber {
    color: #333;
}
.toc, #toc,
.catlinks,
.mw-gallery-traditional li.gallerybox div.thumb,
div.thumbinner {
    border-width: 1px;
    border-style: solid;
    border-color: #E0E0E0 #B1B1B1 #B1B1B1 #E0E0E0;
    box-shadow:  0.25em 0.25em 0.5em rgba(0, 0, 0, 0.05);
}
div.thumbinner {
    padding: 0;
}
div.thumbinner.mp-thumb {
    box-shadow: none;
}
html .thumbimage {
    border: none;
}
html .thumbcaption {
    line-height: 1.5;
    padding: 0.5em;
}
img.thumbborder {
    border-width: 1px;
    border-style: solid;
    border-color: #E0E0E0 #B1B1B1 #B1B1B1 #E0E0E0;
}
.tmulti .tsingle {
    margin: 0 !important;
}
/*  پاپ آپ منابع
.mwe-popups.mwe-popups-type-reference .mwe-popups-title {
    margin-top: 5px;
}
.mwe-popups .mwe-popups-title {
    margin: 0 5px;
}
.mwe-popups.mwe-popups-type-reference .mwe-popups-extract .mwe-popups-fade {
position: inherit;
}
.mwe-popups .mwe-popups-extract {
    margin: 5px;
    position: unset;
}
*/
/* جستجو
#searchInput {
padding: 0.2em 0.4em;
background-color: white !important;
}
*/
/* لوگو */
#p-logo {
    height: 180px;
}
#p-logo a {
    posi tion: fixed;
    margin-top: 10px;
    height: 185px;
}
/*
#mw-panel #p-logo + .portal {
    margin-top: 3em;
}*/
/* تصویر زمینه
body {
    background-color: #b3e1b3;
    background-image: url(background-3.png);
}
#mw-page-base {
background-color: unset;
background-image: none;
}*/
/* تب های بالا
.vectorTabs li {
    background-image: linear-gradient(to top, #6c6 0, rgb(246, 255, 246) 1px, rgba(255,255,255,0) 100%);
}
.vectorTabs, .vectorTabs span, #mw-head .vectorMenu h3 {
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #4bd74b 100%);
}
.vectorTabs .selected {
    background: linear-gradient(to bottom, rgba(179, 225, 179, .1), #fff 70%);
}*/
/* محیط ویرایش */
#wpTextbox1 {
    font-size: 15px;
    font-family: tahoma;
}
/* الگوی شاخه */
.mw-indicator {
font-size: 20px;
}
/* دکمه های جمع شدن منوی سمت راست، بازگشت به بالای صفحه و تغییر اندازه فونت */
.sidebarbottons {
display: block;
position: fixed;
z-index: 999;
right: 0;
height: 23px;
width: 23px;
border: 1px solid #356843;
padding: 2px;
background-repeat: no-repeat;
background-position: center;
border-radius: 3px;
}
.sidebarbottons:hover {
filter: invert(40%);
}
#collsidebar {
background-image: url('/images/d/d6/Right.png');
bottom: calc( 50% + 11px );
}
#totop {
background-image: url('/images/d/da/Up.png');
bottom: calc( 50% + 11px );
}
#fontsizeup {
background-image: url('/images/2/2f/Plus.png');
bottom: calc( 50% - 11px );
}
#fontsizedown {
background-image: url('/images/e/ee/Minus.png');
bottom: calc( 50% - 33px );
}
/* حذف فاصله خالی اول مقالات */
p br {
display: none;
}
.page-کتاب_پاسخ .firstHeading,
.page-نرم‌افزار_پاسخ .firstHeading,
.page-درگاه_کرونا_و_بلایا .firstHeading,
.page-درگاه_مهدویت .firstHeading,
.page-درگاه_غدیر .firstHeading,
.page-درگاه_امام_حسین_ع .firstHeading,
.page-درگاه_فاطمی .firstHeading,
.page-درگاه_حکومت_دینی .firstHeading,
.page-درگاه_حوزه_و_روحانیت .firstHeading,
.page-درگاه_زن_و_خانواده .firstHeading {
display:none;
}
.page-کتاب_پاسخ #content,
.page-نرم‌افزار_پاسخ #content,
.page-درگاه_کرونا_و_بلایا #content,
.page-درگاه_مهدویت #content,
.page-درگاه_غدیر #content,
.page-درگاه_امام_حسین_ع #content,
.page-درگاه_فاطمی #content,
.page-درگاه_حکومت_دینی #content,
.page-درگاه_حوزه_و_روحانیت #content,
.page-درگاه_زن_و_خانواده #content {
padding-top: 0;
}
/* الگو:مقاله‌های کاربر */
.user-articles .mw-newpages-history, .user-articles .mw-newpages-length, .user-articles .mw-userlink, .user-articles .mw-usertoollinks, .user-articles .comment, .user-articles .mw-tag-markers, .user-articles .mw-newpages-oldtitle {
display: none;
}
.user-articles ul {
list-style: persian;
}
/* خرده ریز */
dd {
margin-left: 1em !important;
}
.navbar-mini, .mw-collapsible-toggle {
font-size: 80% !important;
}
.navbox-image img{
max-width: none;
}
/* بسم الله */
.page-صفحهٔ_اصلی #mw-head {
    background-image: url('/images/1/15/Basmala.png');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-x: 50%;
}
/* headings */
h1, h2, h3, h4, h5, h6 {
font-family: sahel;
font-weight: bold;
}
/* editing */
.ve-ui-mwWikitextSurface .ve-ce-attachedRootNode{
font-family:vazir;
font-size: 16px
}
#ca-ve-edit {
display: block !important;
}
/* language list */
#interwiki-completelist {
display: none;
}
* {
    box-sizing: border-box;
}
/* vector 2022 */
.mw-logo {
background-repeat: no-repeat;
background-position: right;
background-size: 60px;
padding: 0px 65px;
height: 60px;
}
.mw-logo-wordmark {
    font-size: 130%;
}
.mw-header {
    min-height: 6em;
}
.mw-content-container, .mw-article-toolbar-container {
  max -width: none;
}
.mw-sidebar-action {
display: none;
}
#p-lang-btn.mw-portlet-empty {
display: block;
}
#p-lang-btn {
float: left;
}
/* جعبه گفتاورد */
.quotebox {
width: 30%
}
@media only screen and (max-width: 600px) {
.quotebox {
width: 100%;
}
}
/* book reader */
.fileInfo .mediawiki-filewarning {
display: none;
}
.fileInfo .oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button {
padding-right: unset;
}
.fileInfo .oo-ui-image-warning {
display: none;
}
.fullMedia .internal::before {
    content: "دانلود "
}
.fullMedia .internal {
color: #fff;
background-color: #36c;
border-color: #36c;
line-height: 1.28571429em;
padding-top: 6px;
padding-bottom: 6px;
transition: background-color 100ms,color 100ms,border-color 100ms,box-shadow 100ms;
padding-right: 12px;
padding-left: 12px;
min-height: 2.28571429em;
}
.fileInfo .mime-type.has-warning {
color: black;
}
.oo-ui-tagMultiselectWidget-handle {
margin-right: 0;
}
/* sidebar */
.sidebar {
max-width: 25%;
}
.mw-parser-output .sidebar {
width: auto !important;
}
/* شاخه */
.mw-indicators {
float: right;
margin: 16px 0;
}
/* hide excess menus for non-logged-in */
#n-امتیاز-مشارکت, #t-whatlinkshere, #t-recentchangeslinked, #t-upload, #t-redirectmaker, #left-navigation, #ca-view, #ca-viewsource {
display: none;
}
.action-history #ca-view {
display: block;
}
.action-history #ca-history {
display: none;
}
.vector-menu-tabs .mw-list-item > a {
padding: 10px 0;
margin-bottom: 0;
border-bottom: none;
}
.mw-article-toolbar-container {
border-bottom: none;
}
.vector-article-toolbar {
float: left;
margin: 10px;
z-index: 1;
position: relative;
}
.page-صفحهٔ_اصلی .vector-article-toolbar {
display: none;
}
#mw-indicator-mw-helplink {
display: none;
}
/* compress header */
.mw-body-content {
  margin-top: 0;
}
}


/* --------------------- متفرقه ----------------- */
/* بزرگنمایی هنگام رفتن موس روی تصویر استفاده شده در الگو های zoom و imagelabel */
/* رنگ پیوندهای قرمز (تغییر به سیاه طبق کد شما) */
 
.zoomonhover {
position: relative;
float: left;
clear: left;
}
.zoomonhovertext {
display: none;
z-index: 1000;
}
.zoomonhoverimageabove {
position: absolute;
left: 0px;
top: 0px;
display: none;
z-index: 100;
max-width: initial;
}
.zoomonhover:hover .zoomonhoverimageabove {
z-index: 10;
display: block;
background-color:white; /* in case of files with transparent background */
}
.zoomonhover:hover .zoomonhovertext {
display: block;
transition: .7s;
position: relative;
}
/* video and audio */
.video, .audio {
max-width: 30%;
}
.thumbinner .video, .thumbinner .audio {
max-width: none;
}
/* redirected from */
.mw-redirectedfrom {
float: left;
margin: -35px 0 0 0;
}
/* hide hitcounter */
#footer-info-0 {
display: none;
}
/* related */
.mw-body {
padding-bottom: 0.5em;
}
.ra-read-more {
padding-top: 0;
}
/* comment section */
.cs-comments, .cs-title-edit-field, .cs-body-edit-field {
  font-family: vazir !important;
}
.cs-header .oo-ui-buttonElement-button[tabindex="0"] {
position: fixed;
top: 4em;
left: 1em;
}
.cs-header .oo-ui-buttonElement-button[title="لغو"], .cs-header .oo-ui-buttonElement-button[title="ثبت"] {
position: relative;
top: unset;
left: unset;
}
/* red links color */
a.new {
a.new {
     color: black !important;
     color: black;
}
 
 
 
 
/* ==========================================================================
  طراحی آیکون‌های مربعی سه‌بعدی و هوشمند (سازگار با انواع تصاویر)
  ========================================================================== */
 
/* کانتینر اصلی و سه‌بعدی آیکون */
.wiki-3d-box {
    width: 110px;
    height: 110px;
    border-radius: 15px; /* گوشه‌های نرم مربع */
    background: radial-gradient(circle at 30% 30%, #ffffff 0%, #fcfcfc 40%, #ececec 80%, #dfdfdf 100%);
    border: 3px solid #eef0f3;
    box-shadow: 0 0px 8px rgba(0, 0, 0, 0.15),
                inset 0 4px 8px rgba(255, 255, 255, 1),
                inset 0 -6px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important; /* انیمیشن نرم رفتن موس */
    cursor: pointer;
}
 
/* افکت رفتن موس روی آیکون (Hover) */
.wiki-3d-box:hover {
    transform: scale(1.08); /* ۸ درصد بزرگ‌نمایی */
    box-shadow: 0 0px 10px rgb(93, 156, 227),
                inset 0 4px 8px rgba(255, 255, 255, 1),
                inset 0 -6px 12px rgba(0, 0, 0, 0.08) !important; /* عمیق‌تر شدن سایه بیرونی */
}
 
/* فریم یا قاب داخلی سفید رنگ دور تصویر */
.wiki-3d-inner-frame {
    width: 105px;
    height: 105px;
    border-radius: 8px;
    border: 4px solid #ffffff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f9f9f9;
}
 
/* نگهدارنده هوشمند تصویر جهت فیت شدن کامل عکس‌های مربع یا مستطیل */
.wiki-3d-image-wrapper {
    min-width: 100%;
    min-height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
 
 
 
 
/* ==========================================================================
  طراحی آیکون‌های دایره سه‌بعدی و هوشمند (سازگار با انواع تصاویر)
  ========================================================================== */
/* کانتینر اصلی و سه‌بعدی آیکون */
.wiki-3d-circle {
    box-sizing: border-box;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, #ffffff 0%, #fcfcfc 40%, #ececec 80%, #dfdfdf 100%);
    border: 3px solid #eef0f3;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.12),
                inset 0 4px 8px rgba(255, 255, 255, 1),
                inset 0 -6px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    cursor: pointer;
}
 
/* افکت رفتن موس روی آیکون */
.wiki-3d-circle:hover {
    transform: scale(1.08);
    box-shadow: 0 0 10px rgba(93, 156, 227, 0.5),
                inset 0 4px 8px rgba(255, 255, 255, 1),
                inset 0 -6px 12px rgba(0, 0, 0, 0.08) !important;
}
 
/* فریم داخلی سفید */
.wiki-3d-inner-frame-circle {
  box-sizing: border-box;
    width: 102px; /* کمی کوچک‌تر شد تا از تداخل مرزها جلوگیری شود */
    height: 102px;
    border-radius: 50%;
    border: 3px solid #ffffff; /* کاهش ضخامت برای هماهنگی بیشتر */
    background-clip: padding-box; /* جلوگیری از نشست رنگ مرز به داخل */
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f9f9f9;
}
 
/* نگهدارنده تصویر */
.wiki-3d-image-wrapper-circle {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
 
.wiki-3d-image-wrapper-circle img,
.wiki-3d-circle img {
        width: 100%;
    height: 100%;
    object-fit: cover; /* پر کردن کامل بدون بهم ریختگی */
    display: block !important;
 
}
 
 
/* --- MediaWiki Full-Width Banner Slider (3:1) --- */
.fgwiki-slider {
    --fgwiki-radius: 8px; /* کمی گردتر برای ظاهر بنری */
    --fgwiki-dot-size: 10px;
    --fgwiki-shadow: none; /* در حالت تمام‌عرض سایه کمتر زیباتر است */
    --fgwiki-overlay: linear-gradient(to top, rgba(0, 0, 0, 0.3), transparent);
   
    position: relative;
    width: 100%;          /* تمام عرض صفحه */
    max-width: 100%;      /* حذف محدودیت عرض */
    margin: 0;            /* حذف حاشیه اضافی برای چسبیدن به متن‌های بالا و پایین */
    border-radius: var(--fgwiki-radius);
    overflow: hidden;
    background: #1a1a1a;
    aspect-ratio: 3 / 1;  /* نسبت ۳ به ۱: ارتفاع دقیقاً یک‌سوم عرض */
    direction: ltr;
}
 
.fgwiki-slider, .fgwiki-slider * { box-sizing: border-box; }
 
  .fgwiki-slider__track {
        position: relative; /* یا absolute، بسته به نیاز */
        width: 100%;      /* یا مقدار ثابت */
height: 100%;    /* یا مقدار ثابت/متغیر دیگر */
 
overflow: hidden; /* برای جلوگیری از بیرون زدن اسلایدها */
    }
.fgwiki-slider__slide {
    position: absolute;
    inset: 0;
    opacity: 0;fgwiki-slider__slide
    visibility: hidden;
    transition: opacity 1s ease, visibility 1s ease;
}
 
.fgwiki-slider__slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
 
.fgwiki-slider__slide::after {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--fgwiki-overlay);
    pointer-events: none;
}
 
.fgwiki-slider__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover; /* پر کردن کادر بدون به‌هم‌ریختگی تصویر */
    object-position: center; /* تمرکز عکس روی مرکز */
}
 
/* دایره‌های پایین */
.fgwiki-slider__dots {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    gap: 8px;
}
 
.fgwiki-slider__dot {
    width: var(--fgwiki-dot-size);
    height: var(--fgwiki-dot-size);
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    padding: 0;
    transition: all 0.3s ease;
}
 
.fgwiki-slider__dot.is-active {
    background: #ffffff;
    transform: scale(1.2);
}
/* کانتینر اصلی */
.video-grid {
    display: flex;
    flex-wrap: wrap; /* اجازه می‌دهد در صفحه کوچک، ویدیوها به سطر بعدی بروند */
    gap: 15px;      /* فاصله بین ویدیوها */
    justify-content: center;
}
 
/* آیتم ویدیو */
.video-item {
    /* در دسکتاپ: ۳ ویدیو در هر ردیف (با کسر فاصله) */
    flex: 1 1 calc(33.33% - 15px);
    min-width: 280px; /* حداقل عرض برای اینکه در تبلت خیلی کوچک نشوند */
}
 
/* در موبایل: ویدیوها ۱۰۰ درصد عرض را می‌گیرند */
@media (max-width: 768px) {
    .video-item {
        flex: 1 1 100%;
        min-width: 100%; /* این خط باعث می‌شود در موبایل کامل پر شود */
    }
}
 
/* تنظیمات خود ویدیو */
.video-item video {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    background-color: #000; /* رنگ پس‌زمینه در صورت لود نشدن */
}
 
 
.category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
    margin: 20px 0;
    padding: 0;
}
 
.category-card {
    display: block;
    padding: 18px 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    text-decoration: none;
    color: #1f2937;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
 
.category-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
    border-color: #cbd5e1;
    text-decoration: none;
}
 
.category-title {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.8;
    margin: 0;
    color: #111827;
}
 
.category-desc {
    display: block;
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.9;
    color: #6b7280;
}
 
.category-section-title {
    font-size: 24px;
    font-weight: 800;
    margin: 24px 0 16px;
    color: #111827;
    text-align: center;
}
 
@media (max-width: 768px) {
    .category-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
 
    .category-card {
        padding: 16px 14px;
        border-radius: 12px;
    }
 
    .category-title {
        font-size: 15px;
    }
 
    .category-desc {
        font-size: 12px;
    }
}
 
/* =========================================
  Full CSS - only requested fixes applied
  Based on pasted-text.txt
  ========================================= */
 
/* 1) Category Tree */
#mw-subcategories ul {
  margin: 0;
  padding-right: 1.5em;
  list-style: none;
}
 
.CategoryTreeChildren {
  margin-left: 1.25em;
}
 
.CategoryTreeToggle {
  color: #36c;
}
 
.CategoryTreeEmptyBullet {
  color: #c8ccd1;
}
 
/* 2) Portal / Province Layouts */
.portal-container-2,
.portal-container-3,
.portal-container-4,
.portal-container-5,
.portal-container-6,
.portal-container-7 {
  display: grid;
  grid-gap: 15px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
 
.portal-container-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
 
.portal-container-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
 
.portal-container-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
 
.portal-container-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
 
.portal-container-6 {
  grid-template-columns: repeat(6, auto);
  grid-template-rows: auto;
}
 
.portal-container-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
 
/* Decouple the columns on narrow screens */
@media screen and (max-width: 992px) {
  .portal-container-2,
  .portal-container-3,
  .portal-container-4,
  .portal-container-5,
  .portal-container-6,
  .portal-container-7 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
 
@media screen and (max-width: 768px) {
  .portal-container-2,
  .portal-container-3,
  .portal-container-4,
  .portal-container-5,
  .portal-container-6,
  .portal-container-7 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
}


/* اصلاح نمایش تصاویر */
/* Sidebar override */
img {
.mw-parser-output .sidebar {
  width: auto !important;
}
 
/* 3) Generic Category Grid */
.category-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
 
.category-card {
  display: block;
  padding: 18px 16px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #e5e7eb;
  text-decoration: none;
  color: #1f2937;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
 
.category-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}
 
.category-title {
  display: block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}
 
.category-desc {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.7;
}
 
/* 4) Wiki Category Grid */
.wiki-category-container {
  direction: rtl;
  max-width: 1400px;
  margin: 10px auto;
  padding: 10px;
  box-sizing: border-box;
}
 
.wiki-category-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
}
 
.wiki-category-card {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 52px;
  padding: 12px 8px !important;
  border: 1.5px solid #8ee0d8;
  border-radius: 12px;
  background: #ffffff;
  color: #2d3748 !important;
  text-decoration: none !important;
  text-align: center;
  font-size: clamp(10px, 0.9vw, 13px) !important;
  font-weight: 400;
  line-height: 1.3;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
 
.wiki-category-card:hover,
.wiki-category-card:active {
  transform: translateY(-3px);
  border-color: #65c3ba;
  color: #65c3ba !important;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(101, 195, 186, 0.15);
}
 
.wiki-category-card:visited {
  color: #2d3748 !important;
}
 
.wiki-category-card:focus {
  outline: none;
  border-color: #65c3ba;
  box-shadow: 0 0 0 3px rgba(101, 195, 186, 0.18);
}
 
@media (max-width: 992px) {
  .wiki-category-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
 
  .wiki-category-card {
    font-size: clamp(9.5px, 1.3vw, 12px) !important;
  }
 
  .category-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
 
@media (max-width: 768px) {
  .wiki-category-container {
    padding: 8px;
  }
 
  .wiki-category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
 
  .wiki-category-card {
    min-height: 46px;
    padding: 10px 6px !important;
    font-size: clamp(9px, 2.8vw, 11px) !important;
  }
 
  .category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
 
 
 
 
 
/* ==========================================================================
  ساختار گالری تصاویر دایره‌ای منعطف (Responsive Circle Gallery)
  طراحی شده برای استفاده در الگوهای ردیفی ویکی
  ========================================================================== */
 
/* کانتینر اصلی گالری */
.wiki-circle-gallery {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 15px 0;
    box-sizing: border-box;
}
 
/* آیتم‌های مجزای گالری (شامل تصویر و کپشن زیر آن) */
.wiki-circle-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex: 1 1 21%; /* توزیع بهینه ۴ ستون در حالت دسکتاپ */
    min-width: 130px; /* جلوگیری از تغییر فرم در صفحات بسیار کوچک */
    gap: 8px; /* فاصله عمودی استاندارد بین دایره و متن */
    box-sizing: border-box;
}
 
/* استایل کپشن زیر تصاویر */
.wiki-circle-caption {
    font-size: 0.88em;
    font-weight: 500;
    line-height: 1.45;
    color: #3b3b3b;
    text-align: center;
    word-break: break-word;
    max-width: 100%;
}
 
 
/* مدل جدید برای فیت کردن عکس داخل دایره */
 
.wiki-avatar-3d {
    width: 230px;
    height: 230px;
    margin: 20px auto;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, #ffffff 0%, #fcfcfc 42%, #ececec 80%, #dfdfdf 100%);
    border: 3px solid #eef0f3;
    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.15),
        inset 0 4px 8px rgba(255, 255, 255, 1),
        inset 0 -6px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
 
.wiki-avatar-3d:hover {
    transform: scale(1.08);
    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.25),
        inset 0 4px 8px rgba(255, 255, 255, 1),
        inset 0 -6px 12px rgba(0, 0, 0, 0.08);
}
 
.wiki-avatar-3d__inner {
    width: 82%;
    height: 82%;
    border-radius: 50%;
    border: 4px solid #fff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    background-color: #f9f9f9;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
 
 
 
/* جلوگیری از اسکرول صفحه */
/* کانتینر اصلی پاپ‌آپ */
/* جلوگیری از اسکرول صفحه */
body.modal-open { overflow: hidden !important; }
 
.discount-overlay {
    position: fixed; inset: 0; z-index: 99999;
    display: flex; align-items: center; justify-content: center;
    padding: 20px; background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    opacity: 0; visibility: hidden; transition: all 0.3s ease;
}
.discount-overlay.is-visible { opacity: 1; visibility: visible; }
 
.discount-modal {
    position: relative; width: min(100%, 500px); padding: 40px 30px;
    text-align: center; background: white; border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
    transform: translateY(30px); transition: 0.4s cubic-bezier(0.17, 0.84, 0.44, 1);
    direction: rtl; font-family: iransans, sans-serif;
}
.discount-overlay.is-visible .discount-modal { transform: translateY(0); }
 
.discount-modal__close {
    position: absolute; top: 15px; left: 15px; background: #f1f5f9;
    border: none; border-radius: 50%; width: 35px; height: 35px; cursor: pointer;
}
 
.discount-modal__image {
    width: 80px; height: 80px; object-fit: contain; margin-bottom: 15px;
    border-radius: 15px;
}
 
.discount-modal__title { color: #0f172a; font-size: 22px; margin: 10px 0; font-weight: 900; }
.discount-modal__desc { color: #64748b; font-size: 14px; line-height: 1.8; margin-bottom: 20px; }
 
.discount-modal__button {
    display: block; width: 100%; padding: 14px; background: #f59e0b;
    color: #111827; text-decoration: none; border-radius: 12px;
    font-weight: bold; font-size: 15px; transition: 0.2s;
}
.discount-modal__button:hover { background: #d97706; color: white; }
 
/* المان تنظیمات که در صفحه مخفی است */
#popup-settings { display: none; }
 
@media (max-width: 768px) {
    .discount-modal {
        width: calc(100% - 24px);
        max-width: none;
        padding: 32px 20px;
        border-radius: 20px;
    }
 
    .discount-modal__title {
        font-size: 20px;
    }
 
    .discount-modal__desc {
        font-size: 15px;
    }
 
    .discount-modal__button {
        padding: 15px;
        font-size: 16px;
    }
 
    .discount-modal__image {
        width: 90px;
        height: 90px;
    }
}
 
@media (max-width: 480px) {
    .discount-modal {
        width: calc(100% - 16px);
        padding: 30px 16px;
    }
}
 
 
/*                نقطه روی عکس            */
/* کانتینر اصلی تصویر */
.interactive-image {
    position: relative;
    width: min(100%, 1000px);
    margin-inline: auto;
    isolation: isolate;
}
 
/* تصویر اصلی */
.interactive-image__main {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 18px;
}
 
/* نقطه تعاملی */
.image-hotspot {
    position: absolute;
    z-index: 3;
    top: var(--y);
    left: var(--x);
    width: 42px;
    height: 42px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
}
 
/* خود نقطه */
.image-hotspot__dot {
    position: relative;
    display: block;
    width: 16px;
    height: 16px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #e11d48;
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.3),
        0 0 0 5px rgba(225, 29, 72, 0.25);
}
 
/* افکت موج دور نقطه */
.image-hotspot__dot::before,
.image-hotspot__dot::after {
    content: "";
    position: absolute;
    inset: 50%;
    width: 100%;
    height: 100%;
    border: 2px solid rgba(255, 255, 255, 0.9);
    border-radius: inherit;
    transform: translate(-50%, -50%);
    animation: hotspotPulse 2s infinite;
}
 
.image-hotspot__dot::after {
    animation-delay: 1s;
}
 
@keyframes hotspotPulse {
    0% {
        width: 100%;
        height: 100%;
        opacity: 0.9;
    }
 
    100% {
        width: 300%;
        height: 300%;
        opacity: 0;
    }
}
 
/* کارت اطلاعات */
.hotspot-card {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    width: min(290px, calc(100% - 24px));
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.25);
    backdrop-filter: blur(10px);
 
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, -45%) scale(0.94);
    transition:
        opacity 180ms ease,
        visibility 180ms ease,
        transform 180ms ease;
}
 
/* وضعیت باز بودن کارت */
.hotspot-card.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, -50%) scale(1);
}
 
/* تصویر داخل کارت */
.hotspot-card__image {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 11px;
}
 
/* محتوای کارت */
.hotspot-card__content {
    padding: 12px 4px 4px;
    text-align: right;
}
 
.hotspot-card__title {
    display: block;
    margin-bottom: 5px;
    color: #0f172a;
    font-size: 16px;
    line-height: 1.6;
}
 
.hotspot-card__description {
    margin: 0 0 12px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.7;
}
 
/* دکمه CTA */
.hotspot-card__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 8px 16px;
    border-radius: 10px;
    background: #e11d48;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background-color 160ms ease,
        transform 160ms ease;
}
 
.hotspot-card__cta:hover {
    background: #be123c;
    transform: translateY(-1px);
}
 
/* دکمه بستن */
.hotspot-card__close {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.75);
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
 
/* نمایش فوکوس برای کاربران کیبورد */
.image-hotspot:focus-visible,
.hotspot-card__close:focus-visible,
.hotspot-card__cta:focus-visible {
    outline: 3px solid #38bdf8;
    outline-offset: 3px;
}
 
/* موبایل */
@media (max-width: 600px) {
    .interactive-image__main {
        border-radius: 12px;
    }
 
    .hotspot-card {
        width: calc(100% - 20px);
    }
 
    .hotspot-card__image {
        aspect-ratio: 2 / 1;
    }
}
 
/* غیرفعال‌کردن انیمیشن برای کاربران حساس به حرکت */
@media (prefers-reduced-motion: reduce) {
    .image-hotspot__dot::before,
    .image-hotspot__dot::after {
        animation: none;
    }
 
    .hotspot-card {
        transition: none;
    }
}
 
 
/* کانتینر 4 تایی*/
 
.sajad-categories {
  width: 100%;
}
 
.sajad-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
 
.sajad-card {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 20px;
  aspect-ratio: 1 / 0.72;
  text-decoration: none;
  background: #f3f3f3;
}
 
.sajad-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.35s ease;
}
 
.sajad-card:hover img {
  transform: scale(1.04);
}
 
.sajad-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.35) 0%,
    rgba(0, 0, 0, 0.05) 45%,
    rgba(0, 0, 0, 0) 70%
  );
  pointer-events: none;
}
 
.sajad-label {
  position: absolute;
  right: 16px;
  bottom: 14px;
  z-index: 2;
  color: #111;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-shadow: 0 1px 2px rgba(255,255,255,0.55);
}
 
.sajad-label--white {
  color: #fff;
  text-shadow: 0 1px 3px rgba(0,0,0,0.55);
}
 
.sajad-card:focus-visible {
  outline: 3px solid #111;
  outline-offset: 3px;
}
 
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
 
@media (max-width: 768px) {
  .sajad-grid {
    grid-template-columns: 1fr;
  }
 
  .sajad-card {
    aspect-ratio: 1 / 0.68;
  }
}
 
 
/*  کانتینر متن و عکس -عکس های اورراید  */
 
.sajad-hero {
  background: var(--hero-bg, #E5D5C0);
  padding: clamp(24px, 4vw, 56px);
  direction: rtl;
  overflow: hidden;
}
 
.sajad-hero__container {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  align-items: center;
  gap: clamp(24px, 4vw, 64px);
  min-height: min(620px, auto);
}
 
.sajad-hero__content {
  text-align: right;
  max-width: 560px;
}
 
.sajad-hero__badge {
  display: inline-block;
  background: var(--hero-badge-bg, #100E47);
  color: var(--hero-badge-text, #fff);
  font-size: clamp(0.85rem, 1vw, 1rem);
  font-weight: 700;
  padding: 10px 16px;
  border-radius: 10px;
  margin-bottom: 18px;
  line-height: 1.6;
}
 
.sajad-hero__title {
  margin: 0 0 14px;
  color: var(--hero-title, #100E47);
  font-size: clamp(1.8rem, 3vw, 3.4rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.02em;
}
 
.sajad-hero__description {
  margin: 0 0 28px;
  color: var(--hero-text, #3E3A36);
  font-size: clamp(0.98rem, 1.1vw, 1.12rem);
  line-height: 2;
  max-width: 52ch;
}
 
.sajad-hero__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--hero-btn-bg, #100E47);
  color: var(--hero-btn-text, #fff);
  text-decoration: none;
  font-weight: 700;
  padding: 14px 26px;
  border-radius: 999px;
  transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 10px 24px rgba(16, 14, 71, 0.18);
}
 
.sajad-hero__button:hover {
  transform: translateY(-2px);
  opacity: 0.95;
}
 
.sajad-hero__media {
  position: relative;
  min-height: 480px;
  display: flex;
  align-items: center;
  justify-content: center;
}
 
.sajad-hero__img {
  position: absolute;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
  background: #fff;
}
 
.sajad-hero__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
 
.sajad-hero__img--back {
  width: min(260px, 42vw);
  height: 420px;
  left: 8%;
  top: 6%;
  z-index: 1;
}
 
.sajad-hero__img--front {
  width: min(290px, 48vw);
  height: 360px;
  left: 28%;
  top: 18%;
  z-index: 2;
}
 
@media (max-width: 992px) {
  .sajad-hero__container {
    grid-template-columns: 1fr;
  }
 
  .sajad-hero__content {
     max-width: 100%;
     max-width: 100%;
     height: auto !important;
  }
 
  .sajad-hero__media {
     min-height: 420px;
    order: 2;
  }
 
  .sajad-hero__img--back {
    left: 12%;
  }
 
  .sajad-hero__img--front {
    left: 34%;
  }
}
 
@media (max-width: 768px) {
  .sajad-hero {
    padding: 20px 16px 28px;
  }
 
  .sajad-hero__title {
    font-size: clamp(1.55rem, 6vw, 2.2rem);
  }
 
  .sajad-hero__description {
    font-size: 0.98rem;
    line-height: 1.9;
  }
 
  .sajad-hero__media {
    min-height: 340px;
    margin-top: 8px;
  }
 
  .sajad-hero__img--back {
    width: 42vw;
    height: 260px;
    left: 2%;
    top: 10%;
  }
 
  .sajad-hero__img--front {
    width: 52vw;
    height: 220px;
    left: 34%;
    top: 18%;
  }
}
 
@media (max-width: 480px) {
  .sajad-hero__badge {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }
 
  .sajad-hero__button {
    width: 100%;
  }
 
  .sajad-hero__media {
    min-height: 280px;
  }
 
  .sajad-hero__img--back {
    width: 46vw;
    height: 220px;
  }
 
  .sajad-hero__img--front {
    width: 58vw;
    height: 190px;
  }
}
 
/*      جدول چاپ بنر*/
.banner-table-section {
  width: 100%;
  margin: 30px auto;
  direction: rtl;
  font-family:  iransans , sans-serif;
}
 
.banner-table-wrap {
  width: 100%;
}
 
.banner-table-title {
  margin: 0 0 18px;
  text-align: right;
  font-size: clamp(20px, 2.2vw, 32px);
  font-weight: 700;
  color: #333;
  line-height: 1.8;
}
 
.banner-table-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 12px;
}
 
.banner-table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}
 
.banner-table caption {
  caption-side: top;
  text-align: right;
  padding: 0 0 14px;
  font-size: 15px;
  color: #666;
  font-weight: 500;
}
 
.banner-table thead th {
  background: #ef2b2d;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 18px 16px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}
 
.banner-table thead th:first-child {
  border-top-right-radius: 12px;
}
 
.banner-table thead th:last-child {
  border-top-left-radius: 12px;
}
 
.banner-table tbody td {
  padding: 18px 16px;
  font-size: 15px;
  color: #333;
  text-align: center;
  vertical-align: middle;
  line-height: 2;
  border-top: 1px solid #f1f1f1;
}
 
.banner-table tbody tr:nth-child(even) td {
  background: #fafafa;
}
 
.banner-table tbody tr:hover td {
  background: #fff4f4;
  transition: 0.25s ease;
}
 
/* بهبود خوانایی ستون اول */
.banner-table tbody td:first-child {
  font-weight: 700;
  color: #222;
  white-space: nowrap;
}
 
/* اسکرول موبایل */
@media (max-width: 768px) {
  .banner-table-title {
    font-size: 20px;
  }
 
  .banner-table {
    min-width: 680px;
  }
 
  .banner-table thead th,
  .banner-table tbody td {
    padding: 14px 12px;
    font-size: 14px;
  }
}
 
 
/* الگو:کانتینر متن عکس دکمه  */
/* Nemati Printing Styles - Updated */
.nemati-wrapper {
    background: #fff;
    border-radius: 40px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 30px;
    gap: 25px;
    border: 1px solid #e0e0e0;
    margin: 20px 0;
    font-family: 'IRANSans', sans-serif; /* مطمئن شوید این فونت در محیط ویکی شما موجود است */
}
 
.nemati-image {
    flex: 1 1 300px; /* تنظیم انعطاف‌پذیری برای جایگزینی */
    text-align: center;
    order: 2; /* تصویر در سمت راست قرار می‌گیرد */
}
.nemati-image img { max-width: 100%; border-radius: 20px; }
 
.nemati-text {
    flex: 2 1 400px; /* تنظیم انعطاف‌پذیری */
    text-align: justify;
    order: 1; /* متن در سمت چپ قرار می‌گیرد */
}
/* تغییر اندازه فونت اینجا اعمال شده است */
.nemati-text h2 { color: #333; margin-top: 0; font-size: 1.3em; } /* 2 درجه کوچکتر از 1.5em */
.nemati-text p { color: #444; line-height: 1.8; margin-bottom: 20px; font-size: 0.9em; } /* 2 درجه کوچکتر از 1.1em */
 
.nemati-btns {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end; /* دکمه‌ها به سمت راست منتقل شدند */
}
.nemati-btn {
    padding: 10px 20px;
    border: 1px solid #ccc;
    border-radius: 12px;
    text-decoration: none !important;
    color: #333;
    font-weight: bold;
    display: flex;
    align-items: center;
    transition: 0.3s;
    font-size: 0.85em; /* کمی کوچکتر برای هماهنگی */
}
.nemati-btn:hover { background: #f0f0f0; }
 
@media (max-width: 768px) {
    .nemati-wrapper { flex-direction: column; text-align: center; }
    .nemati-text { text-align: center; }
    .nemati-btns { justify-content: center; } /* در موبایل دکمه‌ها وسط چین شوند */
    .nemati-image { order: 1; } /* در موبایل تصویر اول نمایش داده شود */
    .nemati-text { order: 2; } /* در موبایل متن بعد از تصویر نمایش داده شود */
}
 
 
/* سایه منحنی  */
/* Container styling for Wiki pages */
.nikan-box {
    position: relative;
    background: #ffffff;
    border: 1px solid #dcdcdc;
    border-top: 4px solid #8b0000; /* خط قرمز تیره بالا */
    padding: 25px;
    margin: 30px 0;
    box-sizing: border-box;
    /* این خاصیت برای دیده شدن سایه پشت کادر ضروری است */
    z-index: 1;
}
 
/* افکت سایه برای القای حس قوس پایین کادر */
.nikan-box::before,
.nikan-box::after {
    content: "";
    position: absolute;
    bottom: -15px;
    width: 44%;
    height: 35px;
    background: transparent;
    box-shadow: 0 15px 20px rgba(0, 0, 0, 0.25);
    border-radius: 50%;
    z-index: -1;
    pointer-events: none; /* تا مزاحم کلیک روی محتوا نشود */
}
 
/* قوس سمت چپ */
.nikan-box::before {
    left: 10px;
    transform: rotate(-3deg);
}
 
/* قوس سمت راست */
.nikan-box::after {
    right: 10px;
    transform: rotate(3deg);
}
 
/* برای اطمینان از اینکه در موبایل هم به هم نریزد */
@media (max-width: 600px) {
    .nikan-box::before, .nikan-box::after {
        display: none; /* در موبایل برای سادگی سایه را حذف می‌کنیم */
    }
}
 
 
 
 
.security-door-card {
  max-width: 1200px;
  margin: 2rem auto;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}
 
.security-door-card__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1200 / 675;
  object-fit: cover;
}
 
.security-door-card__content {
  padding: clamp(16px, 2.5vw, 24px);
}
 
.security-door-card__title {
  margin: 0 0 12px;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.4;
  color: #222;
}
 
.security-door-card__text {
  margin: 0 0 16px;
  font-size: clamp(1rem, 2vw, 1.0625rem);
  line-height: 1.9;
  color: #444;
}
 
.security-door-card__link {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 10px;
  background: #111;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
}
 
.security-door-card__link:hover,
.security-door-card__link:focus {
  background: #333;
}
 
@media (max-width: 480px) {
  .security-door-card {
    margin: 1rem auto;
    border-radius: 12px;
  }
}
 
 
/*باکس های کافی نت*/
.services-section{
 
    max-width:1400px;
    margin:auto;
    padding:40px 20px;
 
}
 
.services-section h2{
 
    text-align:center;
    margin-bottom:35px;
    font-size:32px;
    font-weight:700;
    color:#222;
 
}
 
.service-grid{
 
    display:grid;
 
    grid-template-columns:repeat(4,1fr);
 
    gap:22px;
 
}
 
.service-box{
 
    background:#fff;
 
    border-radius:18px;
 
    min-height:180px;
 
    display:flex;
 
    flex-direction:column;
 
    justify-content:center;
 
    align-items:center;
 
    text-decoration:none;
 
    transition:.35s;
 
    box-shadow:0 5px 20px rgba(0,0,0,.08);
 
    border:1px solid #ececec;
 
    padding:20px;
 
}
 
.service-box:hover{
 
    transform:translateY(-8px);
 
    box-shadow:0 15px 35px rgba(0,0,0,.15);
 
}
 
.service-box i{
 
    font-size:60px;
 
  color:#00b894;
 
    margin-bottom:22px;
 
}
 
.service-box span{
 
    font-size:20px;
 
    font-weight:600;
 
    color:#333;
 
    text-align:center;
 
    line-height:1.8;
 
}
 
/* Tablet */
 
@media(max-width:991px){
 
.service-grid{
 
grid-template-columns:repeat(2,1fr);
 
}
 
.service-box{
 
min-height:165px;
 
}
 
.service-box i{
 
font-size:50px;
 
}
 
}
 
/* Mobile */
 
@media(max-width:576px){
 
.service-grid{
 
grid-template-columns:1fr;
 
}
 
.services-section{
 
padding:20px 15px;
 
}
 
.service-box{
 
min-height:150px;
 
}
 
.service-box i{
 
font-size:42px;
 
}
 
.service-box span{
 
font-size:18px;
 
}
 
}
 
 
/*کانتینر متن و کارت*/
 
.stats-section { padding: 40px 20px; background: #ffffff; font-family: IRANsans,sans-serif; }
.container { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; gap: 40px; flex-wrap: wrap; }
 
.text-side { flex: 1; min-width: 300px; }
.text-side h2 { color: #00b894; margin-bottom: 15px; }
 
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; flex: 1; }
 
.stat-card {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #f8f9fa;
  padding: 15px 20px; /* ارتفاع کمتر */
  border-radius: 10px;
  border: 1px solid #eee;
}
 
.icon { font-size: 24px; color: #00b894; }
 
.stat-info { display: flex; flex-direction: column; }
.number { font-size: 1.4rem; font-weight: bold; color: #333; line-height: 1; }
.stat-info p { font-size: 0.85rem; color: #666; margin: 0; }
 
/* ریسپانسیو */
@media (max-width: 768px) {
  .container { flex-direction: column; }
  .stats-grid { width: 100%; }
}
 
.services-list li i {
    color: #00b894;
}
 
/*  منو */
/* اصلاح تداخل با مدیاویکی */
.poly-nav ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important; /* اجبار به افقی شدن */
    flex-direction: row !important; /* جهت افقی */
    justify-content: flex-start !important;
    background-color: #ffffff;
}
 
.poly-nav li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}
 
/* ظاهر نوار بالای صفحه */
.poly-menu-container {
    width: 100%;
    position: sticky; /* برای اینکه در بالای صفحه بماند */
    top: 0;
    z-index: 999;
}
 
.poly-nav {
    border-bottom: 3px solid #2e7d32;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
 
.poly-nav a {
    display: block;
    padding: 15px 20px;
    text-decoration: none;
    color: #0277bd;
    font-weight: bold;
    white-space: nowrap; /* جلوگیری از شکستن کلمات در منو */
}
 
/* ریست کردن استایل‌های li که ممکن است از پوسته گرفته شود */
.poly-nav li::before {
    content: none !important; /* حذف بولت‌های پیش‌فرض ویکی */
}
/* تنظیمات پایه برای منوی اصلی */
.poly-nav ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    background-color: #ffffff;
}
 
.poly-nav li {
    position: relative; /* بسیار مهم برای موقعیت قرارگیری منوی کشویی */
}
 
.poly-nav a {
    display: block;
    padding: 15px 20px;
    text-decoration: none;
    color: #0277bd;
    font-weight: bold;
    transition: all 0.3s ease;
}
 
/* استایل منوی کشویی (Dropdown) */
.dropdown-content {
    display: none; /* در حالت عادی مخفی باشد */
    position: absolute;
    background-color: #ffffff;
  min-width: 180
    box-shadow: 0px 8px 16px rgba(0,0,0,0.1);
    z-index: 1000;
    border-top: 3px solid #ff8f00; /* رنگ مکمل برای زیبایی */
    border-radius: 0 0 8px 8px;
}
 
/* استایل لینک‌های داخل منوی کشویی */
.dropdown-content a {
    color: #333 !important;
    padding: 12px 16px !important;
    font-size: 0.9rem !important;
    border-bottom: 1px solid #eee;
}
 
.dropdown-content a:last-child {
    border-bottom: none;
}
 
/* حالت Hover برای باز شدن منو */
.dropdown:hover .dropdown-content {
    display: block;
}
 
/* تغییر رنگ در هنگام هاور لینک‌های داخلی */
.dropdown-content a:hover {
    background-color: #f1f8ff !important;
    color: #0277bd !important;
}
 
/* ریسپانسیو: در موبایل منوی کشویی به صورت ستونی زیر هم باز شود */
@media (max-width: 768px) {
    .poly-nav ul {
        flex-direction: column !important;
    }
    .dropdown-content {
        position: static; /* در موبایل، منو زیر هم باز شود نه روی صفحه */
        width: 100%;
        box-shadow: none;
        background-color: #f9f9f9;
    }
    .dropdown:hover .dropdown-content {
        display: block;
    }
}
 
/* مخفی کردن کامل منو در موبایل */
@media (max-width: 768px) {
    .poly-menu-container,
    .poly-nav,
    .poly-nav ul,
    .poly-nav li,
    .poly-nav a {
        display: none !important;
    }
}
 
 
 
 
/*  کانتینر 3ردیف در 2 ستون کادر شامل متن و عکس  */
 
/*==============================================================
    DPX PROFESSIONAL CARD GRID
    Production Version 1.0
    Optimized for MediaWiki
==============================================================*/
 
 
/*==============================================================
    THEME
==============================================================*/
 
:root{
 
    --dpx-primary:#0f5fa8;
    --dpx-primary-hover:#0c4f8d;
 
    --dpx-secondary:#00b894;
    --dpx-secondary-hover:#009a7d;
 
    --dpx-accent:#38bdf8;
 
    --dpx-title:#183153;
    --dpx-text:#5f6f7c;
 
    --dpx-bg:#f7fafc;
    --dpx-card:#ffffff;
 
    --dpx-border:#d9e7ef;
 
    --dpx-radius:24px;
 
    --dpx-speed:.35s;
 
    --dpx-shadow:
 
        0 10px 30px rgba(0,0,0,.06),
 
        0 2px 10px rgba(15,95,168,.05);
 
    --dpx-shadow-hover:
 
        0 20px 50px rgba(15,95,168,.16),
 
        0 8px 24px rgba(0,0,0,.08);
 
}
 
 
/*==============================================================
    RESET
==============================================================*/
 
.dpx-section,
.dpx-section *,
.dpx-section *::before,
.dpx-section *::after{
 
    box-sizing:border-box;
 
}
 
.dpx-section img{
 
    display:block;
 
    max-width:100%;
 
    border:0;
 
}
 
.dpx-section a{
 
    text-decoration:none;
 
}
 
.dpx-section{
 
    direction:rtl;
 
    width:100%;
 
    max-width:1320px;
 
    margin:60px auto;
 
    padding:0 18px;
 
}
 
 
/*==============================================================
    GRID
==============================================================*/
 
.dpx-grid{
 
    display:grid;
 
    grid-template-columns:repeat(2,minmax(0,1fr));
 
    gap:34px;
 
    align-items:stretch;
 
}
 
 
/*==============================================================
    CARD
==============================================================*/
 
.dpx-card{
 
    position:relative;
 
    display:flex;
 
    justify-content:space-between;
 
    align-items:stretch;
 
    overflow:hidden;
 
    background:linear-gradient(
        180deg,
        #ffffff,
        #fbfdff
    );
 
    border:1px solid var(--dpx-border);
 
    border-radius:var(--dpx-radius);
 
    box-shadow:var(--dpx-shadow);
 
    transition:
        transform var(--dpx-speed),
        box-shadow var(--dpx-speed),
        border-color var(--dpx-speed);
 
}
 
 
/*==============================================================
    LEFT GLOW
==============================================================*/
 
.dpx-card::before{
 
    content:"";
 
    position:absolute;
 
    inset:auto auto -120px -120px;
 
    width:240px;
 
    height:240px;
 
    border-radius:50%;
 
    background:
 
    radial-gradient(
 
        rgba(56,189,248,.14),
 
        transparent 70%
 
    );
 
    pointer-events:none;
 
}
 
 
/*==============================================================
    RIGHT ACCENT
==============================================================*/
 
.dpx-card::after{
 
    content:"";
 
    position:absolute;
 
    top:0;
 
    right:0;
 
    width:8px;
 
    height:100%;
 
    background:
 
    linear-gradient(
 
        180deg,
 
        var(--dpx-primary),
 
        var(--dpx-secondary)
 
    );
 
    transition:width .35s ease;
 
}
 
 
/*==============================================================
    HOVER
==============================================================*/
 
.dpx-card:hover{
 
    transform:translateY(-8px);
 
    border-color:#b8ddee;
 
    box-shadow:var(--dpx-shadow-hover);
 
}
 
.dpx-card:hover::after{
 
    width:12px;
 
}
/*==============================================================
    IMAGE MODULE
==============================================================*/
 
.dpx-image{
 
    position:relative;
 
    flex:0 0 42%;
 
    max-width:42%;
 
    overflow:hidden;
 
    background:#edf6fb;
 
    isolation:isolate;
 
}
 
.dpx-image a{
 
    display:block;
 
    width:100%;
 
    height:100%;
 
}
 
.dpx-image img{
 
    width:100%;
 
    height:100%;
 
    min-height:290px;
 
    object-fit:cover;
 
    object-position:center;
 
    transform:scale(1);
 
    transition:
 
        transform .65s ease,
 
        filter .45s ease;
 
}
 
 
/*==============================================================
    IMAGE OVERLAY
==============================================================*/
 
.dpx-image::before{
 
    content:"";
 
    position:absolute;
 
    inset:0;
 
    background:
 
    linear-gradient(
 
        90deg,
 
        rgba(15,95,168,.06),
 
        rgba(0,184,148,.14)
 
    );
 
    z-index:1;
 
    transition:opacity .35s ease;
 
}
 
 
/*==============================================================
    SHINE EFFECT
==============================================================*/
 
.dpx-image::after{
 
    content:"";
 
    position:absolute;
 
    top:-35%;
 
    left:-150%;
 
    width:55%;
 
    height:180%;
 
    background:
 
        linear-gradient(
 
            90deg,
 
            transparent,
 
            rgba(255,255,255,.40),
 
            transparent
 
        );
 
    transform:rotate(18deg);
 
    transition:left .9s ease;
 
    z-index:2;
 
}
 
 
/*==============================================================
    IMAGE HOVER
==============================================================*/
 
.dpx-card:hover .dpx-image img{
 
    transform:scale(1.08);
 
    filter:
 
        saturate(110%)
 
        contrast(104%)
 
        brightness(102%);
 
}
 
.dpx-card:hover .dpx-image::after{
 
    left:170%;
 
}
 
 
/*==============================================================
    IMAGE RADIUS
==============================================================*/
 
.dpx-image{
 
    border-radius:0 24px 24px 0;
 
}
 
 
/*==============================================================
    IMAGE LOADING
==============================================================*/
 
.dpx-image img{
 
    background:#eef5fa;
 
}
 
 
/*==============================================================
    IMAGE PERFORMANCE
==============================================================*/
 
.dpx-image,
.dpx-image img{
 
    backface-visibility:hidden;
 
    transform:translateZ(0);
 
    will-change:transform;
 
}
 
 
/*==============================================================
    OPTIONAL IMAGE BADGE
==============================================================*/
 
.dpx-badge{
 
    position:absolute;
 
    top:18px;
 
    right:18px;
 
    z-index:3;
 
    display:inline-flex;
 
    align-items:center;
 
    justify-content:center;
 
    padding:7px 14px;
 
    border-radius:30px;
 
    background:rgba(255,255,255,.94);
 
    color:var(--dpx-primary);
 
    font-size:.78rem;
 
    font-weight:700;
 
    box-shadow:
 
        0 6px 18px rgba(0,0,0,.08);
 
}
 
 
/*==============================================================
    OPTIONAL IMAGE GRADIENT
==============================================================*/
 
.dpx-gradient{
 
    position:absolute;
 
    inset:auto 0 0 0;
 
    height:90px;
 
    background:
 
        linear-gradient(
 
            transparent,
 
            rgba(0,0,0,.18)
 
        );
 
    z-index:2;
 
    pointer-events:none;
 
}
 
/*==============================================================
    CONTENT MODULE
==============================================================*/
 
.dpx-content{
 
    flex:1;
 
    display:flex;
 
    flex-direction:column;
 
    justify-content:center;
 
    align-items:flex-start;
 
    padding:34px 32px;
 
    position:relative;
 
    z-index:3;
 
}
 
 
/*==============================================================
    CATEGORY
==============================================================*/
 
.dpx-category{
 
    display:inline-flex;
 
    align-items:center;
 
    justify-content:center;
 
    margin-bottom:16px;
 
    padding:7px 16px;
 
    border-radius:40px;
 
    background:rgba(0,184,148,.10);
 
    color:var(--dpx-secondary);
 
    font-size:.80rem;
 
    font-weight:700;
 
    line-height:1;
 
}
 
 
/*==============================================================
    TITLE
==============================================================*/
 
.dpx-title{
 
    margin:0 0 14px;
 
    color:var(--dpx-title);
 
    font-size:1.45rem;
 
    font-weight:800;
 
    line-height:1.6;
 
    letter-spacing:-.2px;
 
}
}


/* استایل تفاوت ویرایش (Diff) */
.dpx-title a{
td.diff-addedline { border-color: #36c; }
td.diff-deletedline { border-color: #fc3; }
td.diff-addedline .diffchange { background: #e9eef9; }
td.diff-deletedline .diffchange { background: #fff4d6; }


/* دکمه ذخیره */
    color:inherit;
#wpSave {
 
    text-decoration:none;
 
    transition:color .30s ease;
 
}
 
.dpx-card:hover .dpx-title{
 
    color:var(--dpx-primary);
 
}
 
 
/*==============================================================
    TITLE BAR
==============================================================*/
 
.dpx-title::after{
 
    content:"";
 
    display:block;
 
    width:54px;
 
    height:4px;
 
    margin-top:12px;
 
    border-radius:20px;
 
    background:
 
        linear-gradient(
 
            90deg,
 
            var(--dpx-primary),
 
            var(--dpx-secondary)
 
        );
 
    transition:width .35s ease;
 
}
 
.dpx-card:hover .dpx-title::after{
 
    width:88px;
 
}
 
 
/*==============================================================
    DESCRIPTION
==============================================================*/
 
.dpx-desc{
 
    margin:0;
 
    color:var(--dpx-text);
 
    font-size:1rem;
 
    line-height:2;
 
    text-align:justify;
 
    display:-webkit-box;
 
    -webkit-box-orient:vertical;
 
    -webkit-line-clamp:2;
 
    overflow:hidden;
 
}
 
 
/*==============================================================
    SPACER
==============================================================*/
 
.dpx-spacer{
 
    flex:1;
 
}
 
 
/*==============================================================
    FOOTER
==============================================================*/
 
.dpx-footer{
 
    width:100%;
 
    margin-top:24px;
 
    display:flex;
 
    justify-content:space-between;
 
    align-items:center;
 
}
 
 
/*==============================================================
    META
==============================================================*/
 
.dpx-meta{
 
    color:#8a98a6;
 
    font-size:.85rem;
 
    font-weight:600;
 
}
 
 
/*==============================================================
    BUTTON
==============================================================*/
 
.dpx-more{
 
    display:inline-flex;
 
    align-items:center;
 
    gap:10px;
 
    padding:12px 22px;
 
    border-radius:60px;
 
    background:
 
        linear-gradient(
 
            135deg,
 
            var(--dpx-primary),
 
            var(--dpx-secondary)
 
        );
 
    color:#ffffff;
 
    font-size:.92rem;
 
    font-weight:700;
 
    text-decoration:none;
 
    transition:
 
        transform .30s ease,
 
        box-shadow .30s ease;
 
    box-shadow:
 
        0 8px 20px rgba(15,95,168,.18);
 
}
 
.dpx-more:hover{
 
    transform:translateX(-5px);
 
    box-shadow:
 
        0 14px 28px rgba(15,95,168,.26);
 
}
 
 
/*==============================================================
    BUTTON ICON
==============================================================*/
 
.dpx-more svg{
 
    width:18px;
 
    height:18px;
 
    flex-shrink:0;
 
    transition:transform .30s ease;
 
}
 
.dpx-more:hover svg{
 
    transform:translateX(-5px);
 
}
 
 
/*==============================================================
    FOCUS
==============================================================*/
 
.dpx-more:focus-visible{
 
    outline:3px solid rgba(56,189,248,.35);
 
    outline-offset:3px;
 
}
 
/*==============================================================
    PREMIUM EFFECTS
==============================================================*/
 
/* Glass Light */
.dpx-card::before{
 
    content:"";
 
    position:absolute;
 
    left:-140px;
 
    bottom:-140px;
 
    width:260px;
 
    height:260px;
 
    border-radius:50%;
 
    background:
        radial-gradient(
            circle,
            rgba(56,189,248,.16) 0%,
            rgba(56,189,248,.05) 45%,
            transparent 72%
        );
 
    pointer-events:none;
 
    transition:
        transform .55s ease,
        opacity .35s ease;
 
    opacity:.9;
 
}
 
.dpx-card:hover::before{
 
    transform:scale(1.18);
 
}
 
 
/*==============================================================
    Premium Border
==============================================================*/
 
.dpx-card{
 
    position:relative;
 
}
 
.dpx-card:hover{
 
    border-color:rgba(0,184,148,.35);
 
}
 
 
/*==============================================================
    Image Animation
==============================================================*/
 
.dpx-card:hover .dpx-image img{
 
    transform:scale(1.07);
 
}
 
 
/*==============================================================
    Content Animation
==============================================================*/
 
.dpx-title,
.dpx-desc,
.dpx-category{
 
    transition:
        transform .35s ease,
        color .35s ease;
 
}
 
.dpx-card:hover .dpx-category{
 
    transform:translateY(-2px);
 
}
 
.dpx-card:hover .dpx-title{
 
    transform:translateY(-3px);
 
}
 
.dpx-card:hover .dpx-desc{
 
    transform:translateY(-2px);
 
}
 
 
/*==============================================================
    Button Shine
==============================================================*/
 
.dpx-more{
 
    position:relative;
 
    overflow:hidden;
 
}
 
.dpx-more::before{
 
    content:"";
 
    position:absolute;
 
    top:0;
 
    left:-150%;
 
    width:60%;
 
    height:100%;
 
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.45),
            transparent
        );
 
    transform:skewX(-20deg);
 
    transition:left .7s ease;
 
}
 
.dpx-more:hover::before{
 
    left:170%;
 
}
 
 
/*==============================================================
    Soft Card Lift
==============================================================*/
 
.dpx-card{
 
    transform-origin:center;
 
}
 
.dpx-card:hover{
 
    transform:
        translateY(-8px)
        scale(1.015);
 
}
 
 
/*==============================================================
    Shadow Layers
==============================================================*/
 
.dpx-card{
 
    box-shadow:
 
        0 10px 20px rgba(15,95,168,.05),
 
        0 18px 40px rgba(0,0,0,.05);
 
}
 
.dpx-card:hover{
 
    box-shadow:
 
        0 16px 34px rgba(15,95,168,.10),
 
        0 30px 70px rgba(0,0,0,.10);
 
}
 
 
/*==============================================================
    Fade Animation
==============================================================*/
 
@keyframes dpxFade{
 
    from{
 
        opacity:0;
 
        transform:
            translateY(24px);
 
    }
 
    to{
 
        opacity:1;
 
        transform:
            translateY(0);
 
    }
 
}
 
.dpx-card{
 
    animation:
        dpxFade .65s ease both;
 
}
 
 
/*==============================================================
    Accessibility
==============================================================*/
 
.dpx-card:focus-within{
 
    box-shadow:
 
        0 0 0 4px rgba(56,189,248,.18),
 
        0 18px 45px rgba(15,95,168,.14);
 
}
 
 
/*==============================================================
    Better Typography
==============================================================*/
 
.dpx-title,
.dpx-desc{
 
    text-rendering:optimizeLegibility;
 
    -webkit-font-smoothing:antialiased;
 
}
 
 
/*==============================================================
    Better Selection
==============================================================*/
 
.dpx-card *::selection{
 
    background:#d9f7ef;
 
    color:#183153;
 
}
 
/*==============================================================
    DPX PRODUCTION FINAL
    Responsive + Performance + Accessibility
==============================================================*/
 
 
/*==============================
    Desktop
==============================*/
 
@media (max-width:1200px){
 
    .dpx-grid{
 
        gap:28px;
 
    }
 
    .dpx-content{
 
        padding:28px;
 
    }
 
    .dpx-title{
 
        font-size:1.32rem;
 
    }
 
}
 
 
/*==============================
    Tablet
==============================*/
 
@media (max-width:992px){
 
    .dpx-grid{
 
        grid-template-columns:1fr;
 
    }
 
}
 
 
/*==============================
    Mobile
==============================*/
 
@media (max-width:768px){
 
    .dpx-section{
 
        padding:0 14px;
 
        margin:36px auto;
 
    }
 
    .dpx-card{
 
        flex-direction:column;
 
    }
 
    .dpx-image{
 
        flex:none;
 
        max-width:100%;
 
        width:100%;
 
        min-height:240px;
 
        border-radius:24px 24px 0 0;
 
    }
 
    .dpx-image img{
 
        min-height:240px;
 
    }
 
    .dpx-content{
 
        width:100%;
 
        padding:24px 20px;
 
    }
 
    .dpx-title{
 
        font-size:1.20rem;
 
    }
 
    .dpx-desc{
 
        -webkit-line-clamp:3;
 
    }
 
    .dpx-footer{
 
        flex-wrap:wrap;
 
        gap:14px;
 
    }
 
}
 
 
/*==============================
    Small Mobile
==============================*/
 
@media (max-width:480px){
 
    .dpx-grid{
 
        gap:18px;
 
    }
 
    .dpx-image{
 
        min-height:200px;
 
    }
 
    .dpx-image img{
 
        min-height:200px;
 
    }
 
    .dpx-content{
 
        padding:18px;
 
    }
 
    .dpx-title{
 
        font-size:1.05rem;
 
    }
 
    .dpx-desc{
 
        font-size:.92rem;
 
        line-height:1.9;
 
    }
 
    .dpx-more{
 
        width:100%;
 
        justify-content:center;
 
    }
 
}
 
 
/*==============================
    Images
==============================*/
 
.dpx-image img{
 
    display:block;
 
    width:100%;
 
    height:100%;
 
    object-fit:cover;
 
}
 
 
/*==============================
    Links
==============================*/
 
.dpx-card a{
 
    -webkit-tap-highlight-color:transparent;
 
}
 
 
/*==============================
    Keyboard
==============================*/
 
.dpx-card a:focus-visible{
 
    outline:3px solid rgba(56,189,248,.35);
 
    outline-offset:3px;
 
    border-radius:8px;
 
}
 
 
/*==============================
    Reduced Motion
==============================*/
 
@media (prefers-reduced-motion:reduce){
 
    .dpx-card,
    .dpx-card *,
    .dpx-image img,
    .dpx-more{
 
        animation:none !important;
 
        transition:none !important;
 
    }
 
}
 
 
/*==============================
    Print
==============================*/
 
@media print{
 
    .dpx-card{
 
        break-inside:avoid;
 
        box-shadow:none;
 
        border:1px solid #cfcfcf;
 
    }
 
}
 
 
/*==============================
    Performance
==============================*/
 
.dpx-card{
 
    contain:layout paint;
 
}
 
.dpx-image img{
 
    image-rendering:auto;
 
}
 
 
/*==============================
    FINAL FIXES
==============================*/
 
/* حذف فاصله ناخواسته تصاویر */
 
.dpx-image picture{
 
    display:block;
 
    width:100%;
 
    height:100%;
 
}
 
/* رفع کشیدگی متن */
 
.dpx-title,
.dpx-desc{
 
    overflow-wrap:anywhere;
 
}
 
/* جلوگیری از اسکرول افقی */
 
.dpx-section{
 
    overflow:hidden;
 
}
 
 
/*  رنگ پس زمینه اختصاصی یک صفحه  */
 
/* ۱. شفاف کردن پس‌زمینه اصلی مدیاویکی برای نمایش گرادینت */
#content, #mw-page-base, #mw-head, .mw-body {
    background: transparent !important;
}
 
/* ۲. تعریف کلاس گرادینت اختصاصی شما */
.my-custom-gradient {
    /* ایجاد گرادینت از بالا به پایین با ترتیب رنگ‌های درخواستی شما */
  background: linear-gradient(180deg,
        #2A7B9B 0%,    /* رنگ بالا */
        #57C785 50%,  /* رنگ میانی */
        #EDDD53 100%  /* رنگ پایین */
    ) !important;
 
    /* ثابت نگه داشتن پس‌زمینه هنگام اسکرول برای جلوگیری از بهم ریختگی */
    background-attachment: fixed !important;
   
    /* ایجاد حس نرمی و محو بودن (Blur effect) با استفاده از ترکیب رنگ‌ها */
    /* توجه: خود گرادینت در لبه‌ها محو می‌شود، اما اگر می‌خواهید محتوا هم نرم باشد: */
    border-radius: 15px;
    padding: 20px;
}
 
 
#content, #mw-page-base, #mw-head, .mw-body {
    background: transparent !important;
}
 
 
=============================================================
تغییرات جدید
============================================================
/* استایل فونت متحرک */
.sanjab-typewriter {
    direction: rtl;
    text-align: center;
    font-family: Tahoma, 'B Nazanin', sans-serif;
    font-size: 50px;
    font-weight: bold;
    color: #1a202c;
    min-height: 120px;
    display: block;
    visibility: hidden; /* تا قبل از شروع جاوااسکریپت مخفی بماند */
    border-left: 4px solid #ff7a00;
    padding-left: 10px;
}
 
===================================================================
 
 
/*    محصولات دایره ای */
 
.products-section{
 
    padding:70px 15px;
 
    background:#fff;
 
}
 
.container{
 
    max-width:1300px;
 
    margin:auto;
 
}
 
.section-header{
 
    text-align:center;
 
    margin-bottom:55px;
 
}
 
.section-header h2{
 
    font-size:42px;
 
    font-weight:700;
 
    color:#111;
 
    position:relative;
 
    display:inline-block;
 
}
 
.section-header h2::after{
 
    content:"";
 
    display:block;
 
    width:80px;
 
    height:3px;
 
    background:#e6e6e6;
 
    margin:15px auto 0;
 
}
 
.products-grid{
 
    display:grid;
 
    grid-template-columns:repeat(4,1fr);
 
    gap:40px;
 
}
 
.product-card{
 
    text-align:center;
 
    transition:.35s;
 
}
 
.product-card a{
 
    color:#333;
 
    text-decoration:none;
 
    display:block;
 
}
 
.product-card figure{
 
    width:190px;
 
    height:190px;
 
    margin:0 auto 25px;
 
    border-radius:0%;
 
    overflow:hidden;
 
    transition:.4s;
 
}
 
.product-card img{
 
    width:100%;
 
    height:100%;
 
    object-fit:cover;
 
    transition:.5s;
 
}
 
.product-card h3{
 
    font-size:29px;
 
    margin-bottom:18px;
 
    color:#222;
 
}
 
.product-card p{
 
    line-height:2;
 
    color:#666;
 
    font-size:17px;
 
}
 
.product-card:hover figure{
 
    transform:translateY(-8px);
 
    box-shadow:0 18px 40px rgba(0,0,0,.18);
 
}
 
.product-card:hover img{
 
    transform:scale(1.08);
 
}
 
.product-card:hover h3{
 
    color:#b48b45;
 
}
 
@media(max-width:1100px){
 
.products-grid{
 
grid-template-columns:repeat(2,1fr);
 
}
 
}
 
@media(max-width:650px){
 
.products-section{
 
padding:45px 15px;
 
}
 
.section-header h2{
 
font-size:34px;
 
}
 
.products-grid{
 
grid-template-columns:1fr;
 
gap:35px;
 
}
 
.product-card figure{
 
width:170px;
 
height:170px;
 
}
 
.product-card h3{
 
font-size:25px;
 
}
 
.product-card p{
 
font-size:16px;
 
line-height:1.9;
 
}
 
}
/*  پایان محصولات دایره ای            */
 
 
/*  دکمه شیشه ای*/
:root {
    /* استخراج پالت رنگی از تصویر */
    --primary-pink: #f8c8d3;
    --glass-bg: rgba(255, 255, 255, 0.25);
    --glass-border: rgba(255, 255, 255, 0.4);
    --shadow-color: rgba(248, 200, 211, 0.5);
    --text-color: #7a5c66;
}
 
.button-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}
 
.glass-button {
    /* ایجاد ساختار دایره‌ای و ریسپانسیو */
    width: 15vw; /* اندازه بر اساس عرض صفحه نمایش */
    min-width: 100px;
    max-width: 200px;
    aspect-ratio: 1 / 1; /* تضمین دایره ماندن در هر شرایطی */
    border-radius: 50%;
   
    /* افکت شیشه‌ای (Glassmorphism) */
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 2px solid var(--glass-border);
   
    /* افکت سه‌بعدی و سایه‌ها */
    box-shadow:
        0 8px 32px 0 var(--shadow-color),
        inset 0 4px 4px rgba(255, 255, 255, 0.3),
        inset 0 -4px 6px rgba(0, 0, 0, 0.05);
   
    /* تایپوگرافی */
    color: var(--text-color);
    font-family: 'Tahoma', sans-serif; /* یا فونت فارسی مورد نظر شما */
     font-weight: bold;
     font-weight: bold;
    font-size: 1.2rem;
    cursor: pointer;
   
    /* انیمیشن و تعامل */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex;
    justify-content: center;
    align-items: center;
    outline: none;
}
/* افکت هنگام نگه داشتن موس (Hover) */
.glass-button:hover {
    transform: translateY(-5px) scale(1.05);
    background: rgba(255, 255, 255, 0.4);
    box-shadow:
        0 15px 45px 0 var(--shadow-color),
        inset 0 2px 2px rgba(255, 255, 255, 0.5);
    color: #4a343c;
}
/* افکت هنگام کلیک (Active) */
.glass-button:active {
    transform: translateY(2px) scale(0.98);
    box-shadow: 0 5px 15px 0 var(--shadow-color);
}
}


/* نمایش جهت درست برای ارجاعات لاتین */
 
LI.mw-cite-dir-ltr {
======================================================
     direction: ltr;
 
     text-align: left;
 
     margin-left: 2.3em;
#city-search-wrapper { margin: 20px 0; }
     list-style-type: decimal !important;
#search-input { width: 100%; max-width: 400px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; }
.province-section { margin-top: 15px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.province-title { font-weight: bold; color: #007bff; margin-bottom: 5px; }
.city-list { display: flex; flex-wrap: wrap; gap: 5px; list-style: none; padding: 0; }
.city-list li { background: #f0f0f0; padding: 3px 10px; border-radius: 10px; font-size: 0.9em; }
 
 
/*  4 کارت اهدا بخشنده*/
 
/* -------------------------
  Medical Categories
-------------------------*/
 
.medical-categories{
    width:100%;
    max-width:1200px;
    margin:auto;
    padding:20px;
    direction:rtl;
}
 
.category-grid{
 
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
 
}
 
.category-card{
 
    background:#f5f5f5;
    border-radius:18px;
    padding:35px 20px;
 
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
 
    text-align:center;
 
    text-decoration:none;
 
    transition:.35s ease;
 
    border:1px solid transparent;
 
    min-height:220px;
 
}
 
.category-card:hover{
 
    transform:translateY(-8px);
 
    box-shadow:0 18px 40px rgba(0,0,0,.08);
 
    border-color:#3b82f6;
 
    background:#fff;
 
}
 
.category-card .icon{
 
    width:85px;
    height:85px;
 
    border-radius:50%;
 
    background:#ffffff;
 
    display:flex;
    justify-content:center;
    align-items:center;
 
    margin-bottom:22px;
 
    box-shadow:0 8px 18px rgba(0,0,0,.05);
 
}
 
.category-card .icon i{
 
    font-size:42px;
 
    color:#14B8A6;
 
    transition:.35s;
 
}
 
 
.category-card:hover .icon i{
 
    transform:scale(1.12);
 
    color:#0F9E90;
 
}
 
.category-card h3{
 
    margin:0;
 
    color:#F97316;
 
    font-size:23px;
 
    line-height:1.8;
 
    font-weight:700;
 
}
 
 
/* رنگ حاشیه هنگام هاور */
.category-card:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.08);
    border-color:#14B8A6;
    background:#fff;
 
 
/* دسترسی برای موتورهای جستجو */
 
.sr-only{
 
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
 
}
 
/* ===========================
      Tablet
=========================== */
 
@media(max-width:992px){
 
.category-grid{
 
grid-template-columns:repeat(2,1fr);
 
}
 
.category-card{
 
min-height:200px;
 
}
 
}
 
/* ===========================
      Mobile
=========================== */
 
@media(max-width:576px){
 
.category-grid{
 
grid-template-columns:repeat(2,1fr);
 
gap:15px;
 
}
 
.category-card{
 
padding:25px 15px;
 
min-height:170px;
 
border-radius:15px;
 
}
 
.category-card .icon{
 
width:65px;
height:65px;
 
margin-bottom:15px;
 
}
 
.category-card .icon i{
 
font-size:32px;
 
}
 
.category-card h3{
 
font-size:18px;
 
}
 
}
/*=============================
        General
=============================*/
 
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}
 
.medical-categories{
 
    max-width:1200px;
    margin:auto;
    padding:20px;
    direction:rtl;
 
}
 
/*=============================
        Grid
=============================*/
 
.category-grid{
 
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
 
}
 
/*=============================
        Card
=============================*/
 
.category-card{
 
    background:#f3f3f3;
    border-radius:18px;
 
    text-decoration:none;
 
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
 
    padding:35px 20px;
 
    min-height:210px;
 
    transition:.35s ease;
 
    border:1px solid #ececec;
 
    box-shadow:0 4px 12px rgba(0,0,0,.03);
 
}
 
.category-card:hover{
 
    background:#ffffff;
 
    transform:translateY(-8px);
 
    box-shadow:0 18px 40px rgba(0,0,0,.08);
 
    border-color:#14B8A6;
 
}
 
/*=============================
        Icon
=============================*/
 
.card-icon{
 
    font-size:62px;
 
    color:#14B8A6;
 
    margin-bottom:20px;
 
    transition:.35s;
 
}
 
.category-card:hover .card-icon{
 
    color:#0F9D8E;
 
    transform:scale(1.1);
 
}
 
/*=============================
        Title
=============================*/
 
.category-card h3{
 
    color:#F97316;
 
    text-align:center;
 
    font-size:24px;
 
    line-height:1.9;
 
    font-weight:700;
 
}
 
/*=============================
        Tablet
=============================*/
 
@media(max-width:992px){
 
.category-grid{
 
grid-template-columns:repeat(2,1fr);
 
}
 
}
 
/*=============================
        Mobile
=============================*/
 
@media(max-width:576px){
 
.category-grid{
 
grid-template-columns:repeat(2,1fr);
 
gap:15px;
 
}
 
.category-card{
 
min-height:165px;
 
padding:25px 15px;
 
border-radius:16px;
 
}
 
.card-icon{
 
font-size:45px;
 
margin-bottom:15px;
 
}
 
.category-card h3{
 
font-size:18px;
 
line-height:1.7;
 
}
 
}
 
/*  کانتینر کادرهای زیر هم دماوندپلیمر          */
 
*{
margin:0;
padding:0;
box-sizing:border-box;
}
 
body{
 
font-family:'Vazirmatn',sans-serif;
 
background:#f2f6fb;
 
display:flex;
 
justify-content:center;
 
padding:40px 15px;
 
}
 
 
.production{
 
width:100%;
max-width:550px;
 
}
 
 
.container{
 
background:linear-gradient(180deg,#1f3f97,#6cbcff);
 
border-radius:35px;
 
padding:35px 25px 0;
 
position:relative;
 
overflow:hidden;
 
box-shadow:0 15px 40px rgba(0,0,0,.15);
 
}
 
h1{
 
color:#fff;
 
font-size:34px;
 
font-weight:700;
 
text-align:center;
 
margin-bottom:35px;
 
}
 
 
.steps{
 
display:flex;
 
flex-direction:column;
 
gap:18px;
 
}
 
.step{
 
background:rgba(255,255,255,.12);
 
border:2px solid rgba(255,255,255,.8);
 
border-radius:18px;
 
padding:18px;
 
text-align:center;
 
color:#fff;
 
font-size:21px;
 
transition:.3s;
 
backdrop-filter:blur(4px);
 
}
 
.step:hover{
 
background:#fff;
 
color:#1d4ca1;
 
transform:translateY(-4px);
 
}
 
 
.image-box{
 
margin-top:35px;
 
display:flex;
 
justify-content:center;
 
}
 
.image-box img{
 
width:65%;
 
max-width:280px;
 
display:block;
 
}
 
.logo{
 
display:flex;
 
justify-content:center;
 
margin-top:25px;
 
}
 
.logo img{
 
width:120px;
 
background:white;
 
padding:12px;
 
border-radius:18px 18px 0 0;
 
}
 
/* ---------- Tablet ---------- */
 
@media(max-width:768px){
 
.container{
 
padding:30px 18px 0;
 
}
 
h1{
 
font-size:28px;
 
}
 
.step{
 
font-size:18px;
 
padding:15px;
 
}
 
.image-box img{
 
width:72%;
 
}
 
}
 
/* ---------- Mobile ---------- */
 
@media(max-width:480px){
 
body{
 
padding:15px;
 
}
 
.container{
 
border-radius:25px;
 
padding:22px 15px 0;
 
}
 
h1{
 
font-size:22px;
 
}
 
.step{
 
font-size:15px;
 
padding:13px;
 
border-radius:14px;
 
}
 
.logo img{
 
width:90px;
 
}
 
.image-box img{
 
width:80%;
 
}
 
}
 
/* ---------- Large Screen ---------- */
 
@media(min-width:1400px){
 
.production{
 
max-width:650px;
 
}
 
h1{
 
font-size:40px;
 
}
 
.step{
 
font-size:23px;
 
}
 
}
/* کانتینر اصلی */
.category-grid {
    display: grid;
    gap: 10px;
    margin: 15px auto;
    max-width: 800px;
    padding: 5px;
    /* این خط باعث می‌شود در همه حالت‌ها پایه روی 2 ستون باشد */
    grid-template-columns: repeat(2, 1fr);
}
 
/* در دسکتاپ (صفحه‌های بزرگتر از 769 پیکسل) تبدیل به 4 ستون می‌شود */
@media (min-width: 769px) {
    .category-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}
 
/* استایل باکس‌ها */
.category-card {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 45px;
    padding: 5px 10px;
    border-radius: 8px;
    text-decoration: none !important;
    transition: transform 0.2s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
    font-weight: 600;
    font-size: 0.85em;
    color: #ffffff !important;
}
 
.category-card:hover {
    transform: translateY(-2px);
}
 
 
/* کانتینر اصلی - وسط‌چین و محدود شده */
.social-section-container {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 20px 0;
}
 
/* نگهدارنده آیکون‌ها - برای جلوگیری از پخش شدن در کل صفحه */
.social-icons-wrapper {
     display: flex;
    flex-direction: row;
    gap: 15px; /* فاصله بین آیکون‌ها */
    padding: 10px;
    align-items: center;
    justify-content: center;
}
 
/* استایل لینک‌ها */
.social-link-item {
    display: inline-block;
     text-decoration: none !important;
    transition: transform 0.2s ease;
}
 
/* استایل تصاویر آیکون - اندازه دقیق در اینجا تعیین می‌شود */
.social-link-item img {
    width: 35px !important;  /* اندازه آیکون‌ها (می‌توانی با تغییر این عدد اندازه را کم یا زیاد کنی) */
    height: 35px !important;
    display: block;
    border-radius: 4px; /* اگر می‌خواهی گوشه‌ها کمی گرد باشد */
}
 
/* افکت هاور برای زیبایی */
.social-link-item:hover {
    transform: scale(1.15); /* کمی بزرگ شدن هنگام نگه داشتن موس */
}
 
 
 
/* کانتینر اصلی برای جلوگیری از هرگونه تداخل */
.fgb-social-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
     margin: 10px 0 !important;
    clear: both !important; /* برای جلوگیری از تداخل با فلوت‌های سایت */
}
 
.fgb-social-box {
    display: flex !important;
    flex-direction: row !important;
    gap: 15px !important;
    justify-content: center !important;
    align-items: center !important;
}
 
.fgb-social-icon {
    display: inline-block !important;
    width: 35px !important; /* اندازه ثابت */
    height: 35px !important; /* اندازه ثابت */
    text-decoration: none !important;
    transition: transform 0.2s ease !important;
}
 
.fgb-social-icon img {
    width: 35px !important; /* اجبار به اندازه ۳۵ پیکسل */
    height: 35px !important; /* اجبار به اندازه ۳۵ پیکسل */
    max-width: 35px !important; /* جلوگیری از بزرگ شدن توسط دستورات سایت */
    min-width: 35px !important; /* جلوگیری از کوچک شدن */
    display: block !important;
    object-fit: contain !important;
}
 
.fgb-social-icon:hover {
    transform: scale(1.2) !important;
}
 
 
/*        پس زمینه تکرار شونده*/
 
 
.vertical-pattern {
    background-image: url("https://dl.faraghaib.ir/m/260022/26002222.jpg");
     background-repeat: repeat-y;
    background-position: top center;
    background-size: auto;
    background-color: #ffffff;
 
    min-height: 100vh;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
}
 
 
 
/*
  Faraghaib / فراغیب
  Paste this file into: MediaWiki:Common.css
  All selectors are scoped to .fg-home to reduce skin conflicts.
  Optional remote assets:
  https://dl.faraghaib.ir/mediawiki/faraghaib/
*/
 
@font-face {
font-family: "FaraghaibVazirmatn";
src: url("https://dl.faraghaib.ir/mediawiki/faraghaib/Vazirmatn-Variable.woff2") format("woff2");
font-style: normal;
font-weight: 100 900;
font-display: swap;
}
 
.mw-parser-output .fg-home {
--fg-ink: #172033;
--fg-muted: #667085;
--fg-soft: #f6f7fb;
--fg-border: rgba(23, 32, 51, 0.1);
--fg-primary: #6d28d9;
--fg-primary-dark: #4c1d95;
--fg-cyan: #06b6d4;
--fg-lime: #b7f34a;
--fg-white: #ffffff;
--fg-shadow: 0 24px 70px rgba(30, 27, 75, 0.12);
box-sizing: border-box;
color: var(--fg-ink);
font-family: "FaraghaibVazirmatn", Vazirmatn, Tahoma, Arial, sans-serif;
font-size: 16px;
line-height: 1.8;
margin: 0 auto;
max-width: 100%;
}
 
.mw-parser-output .fg-home *,
.mw-parser-output .fg-home *::before,
.mw-parser-output .fg-home *::after {
box-sizing: border-box;
}
 
.mw-parser-output .fg-home a {
color: inherit;
}
 
.mw-parser-output .fg-home h1,
.mw-parser-output .fg-home h2,
.mw-parser-output .fg-home h3,
.mw-parser-output .fg-home p {
margin-top: 0;
}
 
.mw-parser-output .fg-home h2 {
font-size: clamp(1.65rem, 3vw, 2.55rem);
letter-spacing: -0.04em;
line-height: 1.35;
margin-bottom: 0.55rem;
}
 
.mw-parser-output .fg-home h3 {
font-size: 1.18rem;
line-height: 1.5;
margin-bottom: 0.55rem;
}
 
.mw-parser-output .fg-shell {
margin: 0 auto;
max-width: 1240px;
padding: 24px 18px 46px;
}
 
.mw-parser-output .fg-hero {
background:
radial-gradient(circle at 80% 15%, rgba(6, 182, 212, 0.2), transparent 30%),
linear-gradient(135deg, #1b1248 0%, #30206d 48%, #6d28d9 100%);
border-radius: 32px;
box-shadow: var(--fg-shadow);
color: #fff;
display: grid;
gap: 22px;
grid-template-columns: minmax(0, 1.07fr) minmax(330px, 0.93fr);
min-height: 540px;
overflow: hidden;
padding: clamp(30px, 5vw, 72px);
position: relative;
}
 
.mw-parser-output .fg-hero::after {
background: linear-gradient(135deg, transparent 45%, rgba(255, 255, 255, 0.08) 45%, rgba(255, 255, 255, 0.08) 55%, transparent 55%);
background-size: 28px 28px;
content: "";
inset: 0;
opacity: 0.25;
pointer-events: none;
position: absolute;
}
 
.mw-parser-output .fg-hero__content,
.mw-parser-output .fg-hero__visual {
position: relative;
z-index: 1;
}
 
.mw-parser-output .fg-hero__content {
align-self: center;
max-width: 680px;
}
 
.mw-parser-output .fg-eyebrow,
.mw-parser-output .fg-kicker {
color: var(--fg-cyan);
display: inline-flex;
font-size: 0.82rem;
font-weight: 800;
letter-spacing: 0.08em;
line-height: 1.4;
text-transform: uppercase;
}
 
.mw-parser-output .fg-eyebrow {
align-items: center;
color: var(--fg-lime);
gap: 9px;
margin-bottom: 18px;
}
 
.mw-parser-output .fg-eyebrow__dot,
.mw-parser-output .fg-status-dot {
background: var(--fg-lime);
border-radius: 50%;
box-shadow: 0 0 0 5px rgba(183, 243, 74, 0.16);
display: inline-block;
height: 8px;
width: 8px;
}
 
.mw-parser-output .fg-hero__title {
font-size: clamp(2.55rem, 6vw, 5.6rem);
font-weight: 900;
letter-spacing: -0.07em;
line-height: 1.05;
margin: 0 0 22px;
max-width: 750px;
}
 
.mw-parser-output .fg-hero__lead {
color: rgba(255, 255, 255, 0.78);
font-size: clamp(1rem, 1.5vw, 1.18rem);
line-height: 2;
margin-bottom: 26px;
max-width: 650px;
}
 
.mw-parser-output .fg-actions {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: 12px;
}
 
.mw-parser-output .fg-button {
align-items: center;
border: 1px solid transparent;
border-radius: 999px;
display: inline-flex;
font-size: 0.95rem;
font-weight: 800;
gap: 10px;
justify-content: center;
min-height: 48px;
padding: 9px 19px;
text-decoration: none;
transition: box-shadow 180ms ease, transform 180ms ease, background-color 180ms ease, color 180ms ease;
}
 
.mw-parser-output .fg-button:hover,
.mw-parser-output .fg-button:focus-visible {
box-shadow: 0 12px 25px rgba(0, 0, 0, 0.16);
transform: translateY(-2px);
text-decoration: none;
}
 
.mw-parser-output .fg-button:focus-visible,
.mw-parser-output .fg-text-link:focus-visible,
.mw-parser-output .fg-contact__email:focus-visible,
.mw-parser-output .fg-service-card__link:focus-visible,
.mw-parser-output .fg-footer a:focus-visible {
outline: 3px solid var(--fg-lime);
outline-offset: 3px;
}
 
.mw-parser-output .fg-button--primary {
background: var(--fg-lime);
color: #18220c;
}
 
.mw-parser-output .fg-button--ghost {
border-color: rgba(255, 255, 255, 0.25);
color: #fff;
}
 
.mw-parser-output .fg-button--ghost:hover,
.mw-parser-output .fg-button--ghost:focus-visible {
background: rgba(255, 255, 255, 0.12);
}
 
.mw-parser-output .fg-button--light {
background: #fff;
color: var(--fg-primary-dark);
}
 
.mw-parser-output .fg-trust-row {
color: rgba(255, 255, 255, 0.66);
display: flex;
flex-wrap: wrap;
font-size: 0.83rem;
gap: 15px 22px;
margin-top: 26px;
}
 
.mw-parser-output .fg-trust-row__item {
align-items: center;
display: inline-flex;
gap: 7px;
}
 
.mw-parser-output .fg-check {
color: var(--fg-lime);
font-weight: 900;
}
 
.mw-parser-output .fg-hero__visual {
align-items: center;
display: flex;
justify-content: center;
min-height: 360px;
}
 
.mw-parser-output .fg-orbit {
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 50%;
height: 350px;
position: absolute;
width: 350px;
}
 
.mw-parser-output .fg-orbit--one {
transform: rotate(28deg) scaleX(0.55);
}
 
.mw-parser-output .fg-orbit--two {
border-color: rgba(183, 243, 74, 0.42);
height: 270px;
transform: rotate(-36deg) scaleX(0.5);
width: 270px;
}
 
.mw-parser-output .fg-code-window {
background: rgba(13, 12, 37, 0.8);
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 20px;
box-shadow: 0 24px 60px rgba(3, 3, 16, 0.35);
max-width: 440px;
overflow: hidden;
position: relative;
transform: rotate(4deg);
width: 100%;
}
 
.mw-parser-output .fg-code-window__bar {
align-items: center;
background: rgba(255, 255, 255, 0.06);
color: rgba(255, 255, 255, 0.6);
display: flex;
font-size: 0.72rem;
gap: 6px;
padding: 12px 15px;
}
 
.mw-parser-output .fg-code-window__bar span {
background: #ff6b6b;
border-radius: 50%;
height: 7px;
width: 7px;
}
 
.mw-parser-output .fg-code-window__bar span:nth-child(2) {
background: #ffd166;
}
 
.mw-parser-output .fg-code-window__bar span:nth-child(3) {
background: #7be495;
}
 
.mw-parser-output .fg-code-window__bar b {
font-weight: 600;
margin-right: auto;
}
 
.mw-parser-output .fg-code-window__body {
color: #d7d5ff;
direction: ltr;
font-family: Consolas, "Courier New", monospace;
font-size: clamp(0.72rem, 1.2vw, 0.88rem);
line-height: 1.9;
margin: 0;
overflow: auto;
padding: 23px 20px;
text-align: left;
white-space: pre;
}
 
.mw-parser-output .fg-code-keyword {
color: #c084fc;
}
 
.mw-parser-output .fg-code-property {
color: #67e8f9;
}
 
.mw-parser-output .fg-code-string {
color: #bef264;
}
 
.mw-parser-output .fg-code-boolean {
color: #fbbf24;
}
 
.mw-parser-output .fg-code-window__status {
align-items: center;
background: rgba(183, 243, 74, 0.08);
color: rgba(255, 255, 255, 0.72);
display: flex;
font-size: 0.75rem;
gap: 9px;
padding: 11px 15px;
}
 
.mw-parser-output .fg-status-dot {
height: 6px;
width: 6px;
}
 
.mw-parser-output .fg-stats {
display: grid;
gap: 12px;
grid-template-columns: repeat(4, 1fr);
margin: -34px auto 76px;
max-width: 1060px;
position: relative;
z-index: 3;
}
 
.mw-parser-output .fg-stat {
background: rgba(255, 255, 255, 0.94);
border: 1px solid var(--fg-border);
border-radius: 18px;
box-shadow: 0 18px 46px rgba(30, 27, 75, 0.1);
padding: 22px 16px;
text-align: center;
}
 
.mw-parser-output .fg-stat__number {
color: var(--fg-primary);
display: block;
font-size: clamp(1.8rem, 3vw, 2.5rem);
font-weight: 900;
line-height: 1.2;
}
 
.mw-parser-output .fg-stat__label {
color: var(--fg-muted);
display: block;
font-size: 0.82rem;
margin-top: 6px;
}
 
.mw-parser-output .fg-section-heading {
align-items: end;
display: flex;
gap: 36px;
justify-content: space-between;
margin: 0 0 28px;
}
 
.mw-parser-output .fg-section-heading > div {
max-width: 680px;
}
 
.mw-parser-output .fg-section-heading > p {
color: var(--fg-muted);
font-size: 0.95rem;
margin-bottom: 4px;
max-width: 430px;
}
 
.mw-parser-output .fg-kicker {
color: var(--fg-primary);
margin-bottom: 9px;
}
 
.mw-parser-output .fg-service-grid {
display: grid;
gap: 14px;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-bottom: 92px;
}
 
.mw-parser-output .fg-service-card {
background: var(--fg-white);
border: 1px solid var(--fg-border);
border-radius: 22px;
box-shadow: 0 10px 30px rgba(30, 27, 75, 0.04);
display: flex;
flex-direction: column;
min-height: 315px;
padding: 24px;
position: relative;
transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
 
.mw-parser-output .fg-service-card:hover {
border-color: rgba(109, 40, 217, 0.38);
box-shadow: 0 20px 42px rgba(30, 27, 75, 0.1);
transform: translateY(-6px);
}
 
.mw-parser-output .fg-service-card--featured {
background: linear-gradient(160deg, #6d28d9, #4c1d95);
color: #fff;
}
 
.mw-parser-output .fg-service-card__number {
color: var(--fg-primary);
font-size: 0.76rem;
font-weight: 900;
letter-spacing: 0.08em;
}
 
.mw-parser-output .fg-service-card--featured .fg-service-card__number {
color: var(--fg-lime);
}
 
.mw-parser-output .fg-service-card__icon {
align-items: center;
background: rgba(109, 40, 217, 0.1);
border-radius: 12px;
color: var(--fg-primary);
display: flex;
font-family: Consolas, monospace;
font-size: 0.78rem;
font-weight: 900;
height: 46px;
justify-content: center;
margin: 21px 0 18px;
width: 46px;
}
 
.mw-parser-output .fg-service-card--featured .fg-service-card__icon {
background: rgba(255, 255, 255, 0.14);
color: var(--fg-lime);
}
 
.mw-parser-output .fg-service-card p {
color: var(--fg-muted);
font-size: 0.9rem;
line-height: 1.9;
margin-bottom: 19px;
}
 
.mw-parser-output .fg-service-card--featured p {
color: rgba(255, 255, 255, 0.74);
}
 
.mw-parser-output .fg-service-card__link,
.mw-parser-output .fg-text-link {
align-items: center;
color: var(--fg-primary);
display: inline-flex;
font-size: 0.85rem;
font-weight: 900;
gap: 8px;
margin-top: auto;
text-decoration: none;
}
 
.mw-parser-output .fg-service-card--featured .fg-service-card__link {
color: var(--fg-lime);
}
 
.mw-parser-output .fg-service-card__link:hover,
.mw-parser-output .fg-text-link:hover {
text-decoration: underline;
text-underline-offset: 5px;
}
 
.mw-parser-output .fg-story {
align-items: center;
background: var(--fg-soft);
border: 1px solid var(--fg-border);
border-radius: 28px;
display: grid;
gap: clamp(28px, 5vw, 72px);
grid-template-columns: minmax(280px, 0.88fr) minmax(0, 1.12fr);
margin-bottom: 90px;
overflow: hidden;
padding: clamp(20px, 4vw, 42px);
}
 
.mw-parser-output .fg-story__media {
height: 360px;
min-height: 360px;
position: relative;
}
 
.mw-parser-output .fg-story__media > .mw-file-element,
.mw-parser-output .fg-story__media img {
border-radius: 20px;
height: 100%;
object-fit: cover;
width: 100%;
}
 
.mw-parser-output .fg-story__media .image,
.mw-parser-output .fg-story__media .thumb,
.mw-parser-output .fg-story__media .mw-file-description {
display: block;
height: 100%;
}
 
.mw-parser-output .fg-story__media .thumbinner {
background: transparent;
border: 0;
padding: 0;
width: 100% !important;
}
 
.mw-parser-output .fg-story__media .thumbcaption {
display: none;
}
 
.mw-parser-output .fg-story__badge {
background: var(--fg-lime);
border-radius: 16px;
bottom: 18px;
box-shadow: 0 12px 30px rgba(16, 24, 40, 0.18);
display: flex;
flex-direction: column;
left: 18px;
line-height: 1.4;
padding: 13px 16px;
position: absolute;
}
 
.mw-parser-output .fg-story__badge strong {
font-size: 1.1rem;
}
 
.mw-parser-output .fg-story__badge span {
font-size: 0.75rem;
}
 
.mw-parser-output .fg-story__content {
max-width: 620px;
}
 
.mw-parser-output .fg-story__content p {
color: var(--fg-muted);
font-size: 0.96rem;
line-height: 2;
}
 
.mw-parser-output .fg-story__points {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin: 23px 0;
}
 
.mw-parser-output .fg-story__points span {
align-items: center;
background: #fff;
border: 1px solid var(--fg-border);
border-radius: 999px;
color: var(--fg-muted);
display: inline-flex;
font-size: 0.78rem;
gap: 7px;
padding: 7px 11px;
}
 
.mw-parser-output .fg-story__points b {
align-items: center;
background: rgba(109, 40, 217, 0.1);
border-radius: 50%;
color: var(--fg-primary);
display: inline-flex;
font-size: 0.7rem;
height: 22px;
justify-content: center;
width: 22px;
}
 
.mw-parser-output .fg-media-section {
margin-bottom: 92px;
}
 
.mw-parser-output .fg-media-grid {
display: grid;
gap: 15px;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
 
.mw-parser-output .fg-media-card {
background: var(--fg-white);
border: 1px solid var(--fg-border);
border-radius: 22px;
box-shadow: 0 10px 30px rgba(30, 27, 75, 0.04);
overflow: hidden;
padding: 24px;
}
 
.mw-parser-output .fg-media-card__heading {
margin-bottom: 18px;
}
 
.mw-parser-output .fg-media-card__label {
color: var(--fg-primary);
display: block;
font-size: 0.76rem;
font-weight: 900;
letter-spacing: 0.08em;
margin-bottom: 4px;
text-transform: uppercase;
}
 
.mw-parser-output .fg-media-card__heading h3 {
margin-bottom: 0;
}
 
.mw-parser-output .fg-media-frame {
align-items: center;
background: #16122d;
border-radius: 16px;
display: flex;
justify-content: center;
min-height: 240px;
overflow: hidden;
}
 
.mw-parser-output .fg-media-frame .image,
.mw-parser-output .fg-media-frame .thumb,
.mw-parser-output .fg-media-frame .mw-file-description {
display: block;
max-width: 100%;
width: 100%;
}
 
.mw-parser-output .fg-media-frame img {
display: block;
height: auto;
max-height: 390px;
max-width: 100%;
margin: 0 auto;
object-fit: contain;
width: auto;
}
 
.mw-parser-output .fg-media-frame .thumbinner {
background: transparent;
border: 0;
padding: 0;
width: 100% !important;
}
 
.mw-parser-output .fg-media-frame .thumbcaption {
display: none;
}
 
.mw-parser-output .fg-media-frame--audio {
background:
radial-gradient(circle at 22% 30%, rgba(183, 243, 74, 0.16), transparent 23%),
linear-gradient(135deg, #171238, #3a1e76);
min-height: 240px;
}
 
.mw-parser-output .fg-media-card > p {
color: var(--fg-muted);
font-size: 0.88rem;
margin: 15px 0 0;
}
 
.mw-parser-output .fg-slider-section {
margin-bottom: 92px;
}
 
.mw-parser-output .fg-slider {
background: #15102f;
border-radius: 28px;
box-shadow: var(--fg-shadow);
color: #fff;
overflow: hidden;
}
 
.mw-parser-output .fg-slider__viewport {
min-height: 430px;
position: relative;
}
 
.mw-parser-output .fg-slide {
align-items: stretch;
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
min-height: 430px;
padding: clamp(20px, 4vw, 44px);
}
 
.mw-parser-output .fg-slider--ready .fg-slide {
display: none;
}
 
.mw-parser-output .fg-slider--ready .fg-slide.is-active {
display: flex;
}
 
.mw-parser-output .fg-slide > .image,
.mw-parser-output .fg-slide > .thumb,
.mw-parser-output .fg-slide > .mw-file-description {
align-items: center;
display: flex;
flex: 1;
justify-content: center;
min-height: 260px;
}
 
.mw-parser-output .fg-slide .thumbinner {
background: transparent;
border: 0;
padding: 0;
width: 100% !important;
}
 
.mw-parser-output .fg-slide .thumbcaption {
display: none;
}
 
.mw-parser-output .fg-slide img {
border-radius: 17px;
display: block;
height: 285px;
margin: 0 auto;
max-width: 100%;
object-fit: cover;
width: min(760px, 100%);
}
 
.mw-parser-output .fg-slide__caption {
display: flex;
flex-direction: column;
gap: 4px;
margin-top: 20px;
}
 
.mw-parser-output .fg-slide__caption strong {
font-size: 1.25rem;
}
 
.mw-parser-output .fg-slide__caption span {
color: rgba(255, 255, 255, 0.62);
font-size: 0.86rem;
}
 
.mw-parser-output .fg-slider__controls {
align-items: center;
border-top: 1px solid rgba(255, 255, 255, 0.12);
display: flex;
gap: 15px;
justify-content: space-between;
padding: 16px 22px;
}
 
.mw-parser-output .fg-slider__button,
.mw-parser-output .fg-slider__dot {
appearance: none;
border: 0;
cursor: pointer;
}
 
.mw-parser-output .fg-slider__button {
background: rgba(255, 255, 255, 0.1);
border-radius: 50%;
color: #fff;
font-size: 1.1rem;
height: 38px;
line-height: 1;
width: 38px;
}
 
.mw-parser-output .fg-slider__button:hover,
.mw-parser-output .fg-slider__button:focus-visible {
background: var(--fg-primary);
}
 
.mw-parser-output .fg-slider__dots {
display: flex;
gap: 8px;
}
 
.mw-parser-output .fg-slider__dot {
background: rgba(255, 255, 255, 0.25);
border-radius: 999px;
height: 7px;
padding: 0;
transition: background-color 180ms ease, width 180ms ease;
width: 22px;
}
 
.mw-parser-output .fg-slider__dot.is-active {
background: var(--fg-lime);
width: 42px;
}
 
.mw-parser-output .fg-slider__button:focus-visible,
.mw-parser-output .fg-slider__dot:focus-visible {
outline: 3px solid var(--fg-lime);
outline-offset: 3px;
}
 
.mw-parser-output .fg-process {
margin-bottom: 92px;
}
 
.mw-parser-output .fg-process__grid {
border-bottom: 1px solid var(--fg-border);
border-top: 1px solid var(--fg-border);
display: grid;
grid-template-columns: repeat(4, 1fr);
}
 
.mw-parser-output .fg-process__item {
border-left: 1px solid var(--fg-border);
padding: 25px 22px;
}
 
.mw-parser-output .fg-process__item:first-child {
border-left: 0;
}
 
.mw-parser-output .fg-process__item > span {
color: var(--fg-primary);
font-size: 0.82rem;
font-weight: 900;
}
 
.mw-parser-output .fg-process__item h3 {
margin: 18px 0 6px;
}
 
.mw-parser-output .fg-process__item p {
color: var(--fg-muted);
font-size: 0.86rem;
line-height: 1.8;
margin: 0;
}
 
.mw-parser-output .fg-contact {
align-items: center;
background:
radial-gradient(circle at 20% 20%, rgba(183, 243, 74, 0.2), transparent 25%),
linear-gradient(135deg, #4c1d95, #6d28d9);
border-radius: 28px;
color: #fff;
display: flex;
gap: 30px;
justify-content: space-between;
margin-bottom: 22px;
overflow: hidden;
padding: clamp(28px, 5vw, 55px);
position: relative;
}
 
.mw-parser-output .fg-contact__content {
max-width: 780px;
position: relative;
z-index: 1;
}
 
.mw-parser-output .fg-contact .fg-kicker {
color: var(--fg-lime);
}
 
.mw-parser-output .fg-contact h2 {
font-size: clamp(1.75rem, 4vw, 3.3rem);
margin-bottom: 14px;
}
 
.mw-parser-output .fg-contact p {
color: rgba(255, 255, 255, 0.72);
margin-bottom: 24px;
max-width: 680px;
}
 
.mw-parser-output .fg-contact__email {
color: rgba(255, 255, 255, 0.78);
font-size: 0.9rem;
font-weight: 700;
text-decoration: none;
}
 
.mw-parser-output .fg-contact__email:hover {
color: var(--fg-lime);
text-decoration: underline;
}
 
.mw-parser-output .fg-contact__mark {
color: rgba(255, 255, 255, 0.11);
font-size: 20rem;
font-weight: 900;
line-height: 0.7;
position: absolute;
left: 1%;
top: 27%;
transform: rotate(-10deg);
}
 
.mw-parser-output .fg-footer {
align-items: center;
color: var(--fg-muted);
display: flex;
font-size: 0.78rem;
justify-content: space-between;
padding: 12px 4px;
}
 
.mw-parser-output .fg-footer a {
color: var(--fg-primary);
font-weight: 800;
text-decoration: none;
}
 
.mw-parser-output .fg-footer a:hover {
text-decoration: underline;
}
 
.mw-parser-output .fg-reveal {
opacity: 1;
transform: none;
}
 
.mw-parser-output .fg-reveal.fg-reveal--pending {
opacity: 0;
transform: translateY(18px);
transition: opacity 600ms ease, transform 600ms ease;
}
 
.mw-parser-output .fg-reveal.fg-reveal--visible {
opacity: 1;
transform: translateY(0);
}
 
@media (max-width: 1050px) {
.mw-parser-output .fg-service-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
 
.mw-parser-output .fg-service-card {
min-height: 270px;
}
}
 
@media (max-width: 820px) {
.mw-parser-output .fg-hero {
grid-template-columns: 1fr;
min-height: auto;
padding: 34px 25px 26px;
}
 
.mw-parser-output .fg-hero__visual {
min-height: 310px;
}
 
.mw-parser-output .fg-stats {
margin-top: -18px;
}
 
.mw-parser-output .fg-story {
grid-template-columns: 1fr;
}
 
.mw-parser-output .fg-story__media {
height: 300px;
min-height: 300px;
}
 
.mw-parser-output .fg-process__grid {
grid-template-columns: repeat(2, 1fr);
}
 
.mw-parser-output .fg-process__item:nth-child(odd) {
border-left: 0;
}
 
.mw-parser-output .fg-process__item:nth-child(-n + 2) {
border-bottom: 1px solid var(--fg-border);
}
}
 
@media (max-width: 620px) {
.mw-parser-output .fg-shell {
padding: 12px 10px 30px;
}
 
.mw-parser-output .fg-hero,
.mw-parser-output .fg-contact {
border-radius: 22px;
}
 
.mw-parser-output .fg-hero__title {
font-size: clamp(2.35rem, 12vw, 3.4rem);
}
 
.mw-parser-output .fg-hero__lead {
line-height: 1.9;
}
 
.mw-parser-output .fg-code-window {
transform: rotate(0);
}
 
.mw-parser-output .fg-orbit {
height: 280px;
width: 280px;
}
 
.mw-parser-output .fg-stats,
.mw-parser-output .fg-service-grid,
.mw-parser-output .fg-media-grid {
grid-template-columns: 1fr 1fr;
}
 
.mw-parser-output .fg-stat {
padding: 16px 8px;
}
 
.mw-parser-output .fg-stat__label {
font-size: 0.7rem;
}
 
.mw-parser-output .fg-section-heading {
align-items: start;
flex-direction: column;
gap: 3px;
}
 
.mw-parser-output .fg-service-card {
min-height: 0;
padding: 18px;
}
 
.mw-parser-output .fg-story,
.mw-parser-output .fg-media-card {
border-radius: 20px;
padding: 18px;
}
 
.mw-parser-output .fg-story__media {
height: 230px;
min-height: 230px;
}
 
.mw-parser-output .fg-story__badge {
bottom: 10px;
left: 10px;
}
 
.mw-parser-output .fg-process__grid {
grid-template-columns: 1fr;
}
 
.mw-parser-output .fg-process__item,
.mw-parser-output .fg-process__item:nth-child(odd) {
border-bottom: 1px solid var(--fg-border);
border-left: 0;
}
 
.mw-parser-output .fg-process__item:last-child {
border-bottom: 0;
}
 
.mw-parser-output .fg-contact {
align-items: flex-start;
flex-direction: column;
}
 
.mw-parser-output .fg-contact__mark {
font-size: 12rem;
left: 8%;
top: 56%;
}
 
.mw-parser-output .fg-footer {
align-items: flex-start;
flex-direction: column;
gap: 4px;
}
}
 
@media (prefers-reduced-motion: reduce) {
.mw-parser-output .fg-home *,
.mw-parser-output .fg-home *::before,
.mw-parser-output .fg-home *::after {
scroll-behavior: auto !important;
transition-duration: 0.01ms !important;
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
}
}
}
برگرفته از «https://fa.faraghaib.ir/wiki/مدیاویکی:Common.css»