/* Shared accessibility and responsive corrections, after page-specific styles. */
html { scroll-behavior: smooth; }
body { color: #666; }
img, video { max-width: 100%; height: auto; }
iframe { max-width: 100%; }
#main { min-width: 0; overflow-wrap: anywhere; }
#main a:not(.button) { color: #26775e; }
#main .newsletter-meta, #main .date-container { color: #666; }
#header { overflow-y: auto; }
#header #footer { position: static; width: 100%; padding: 2em 0 0; margin-top: auto; }
#header .profile-heading { color: rgba(255,255,255,.8); font-size: 1.35em; line-height: 1.75em; margin: 0; }
#header .profile-heading strong { color: #fff; }
#header nav ul.nav-links { list-style: none; padding: 0; margin: 1.25em 0; }
#header nav ul.nav-links li { padding: 0; }
#header nav ul.nav-links li a, #header ul.icons li a { color: #d1d1d1; }
#header nav ul.nav-links li a { display: inline-block; min-height: 28px; padding: .1em 0; }
#header nav ul.nav-links li a[aria-current=page] { color: #fff; text-decoration: underline; text-underline-offset: .3em; }
#header nav ul.nav-links li a:hover, #header ul.icons li a:hover { color: #b1e1d0; }
#header .profile-heading a { color: #b1e1d0; }
#footer .copyright { color: #bbb; }
#main .page-title { font-size: 1.5em; line-height: 1.5em; margin: 0 0 1em; color: #666; }
#main header.major .page-title { font-size: 2em; }
:focus-visible { outline: 3px solid #26775e; outline-offset: 4px; }
#header :focus-visible, #footer :focus-visible { outline-color: #c9f3e4; }
.skip-link { position: fixed; top: .5rem; left: .5rem; z-index: 10000; padding: .6em 1em; background: #fff; color: #174e3e; transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
.actions { flex-wrap: wrap; }
.button { max-width: 100%; white-space: normal; height: auto; min-height: 2.75em; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
html[lang=fa] #main { line-height: 1.9; }
html[lang=fa] [lang=en], a[dir=ltr], input[dir=ltr] { unicode-bidi: isolate; }
@media screen and (max-width: 980px) {
  #header { overflow-y: visible; }
  #header nav ul.nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .2em 1em; }
  #header nav ul.nav-links li a { min-height: 44px; padding: .45em .15em; }
  #footer .copyright { color: #666; }
}
@media screen and (max-width: 736px) {
  #main .page-title { font-size: 1.2em; }
  #main header.major .page-title { font-size: 1.35em; }
  #header { padding-top: 5em; }
  #header .profile-heading { line-height: 1.6; }
  #header .profile-heading br { display: block; }
  .persian-button, .language-switch-button { min-height: 44px; }
  ul.actions { display: flex; flex-wrap: wrap; gap: .5em; }
  ul.actions li { padding: 0; max-width: 100%; }
  table { display: block; max-width: 100%; overflow-x: auto; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Small local flag images in language switches. */
.persian-button .language-flag, .language-switch-button .language-flag {
  display: inline-block;
  width: 24px;
  height: 18px;
  max-width: none;
  flex: 0 0 24px;
  margin-inline-end: .45em;
  border-radius: 2px;
  vertical-align: middle;
}
.site-language-switch { position: absolute; top: 1em; right: 1em; z-index: 1000; }
html[lang=fa] .site-language-switch { right: auto; left: 1em; }
.site-language-switch .language-switch-button {
  display: inline-flex; align-items: center; min-height: 44px;
  background: #555; color: #fff; padding: .5em 1em;
  border-radius: .5em; text-decoration: none; font-weight: bold;
}
.site-language-switch .language-switch-button:hover { background: #777; }

/* Keep each article card's two reading actions alongside one another. */
#main .newsletter-item ul.actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5em;
  margin-inline: 0;
  padding: 0;
  width: 100%;
}
#main .newsletter-item ul.actions > li { width: auto; min-width: 0; padding: 0; }
#main .newsletter-item ul.actions > li > .button {
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-width: 0; height: 100%; min-height: 3em;
  margin: 0; padding: .5em; line-height: 1.5;
}