/* =========================================================
   KIZILCIK — Cassiopeia
   ========================================================= */


/* ---------------------------------------------------------
   Colours
   --------------------------------------------------------- */

:root {
  --kizilcik-charcoal: #181818;
  --kizilcik-text: #222222;
  --kizilcik-muted: #666666;

  --kizilcik-red: #c82026;
  --kizilcik-hover: #8b343b;

  --kizilcik-link: #1f4f9b;
  --kizilcik-sidebar-link: #3f5060;
  --kizilcik-rule: #d8d8d8;
}


/* ---------------------------------------------------------
   Basic typography
   --------------------------------------------------------- */

body {
  color: var(--kizilcik-text);
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif;
  line-height: 1.6;
}

a {
  color: var(--kizilcik-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.14em;
}

a:hover,
a:focus {
  color: var(--kizilcik-hover);
}


/* =========================================================
   Header
   ========================================================= */

.container-header {
  background: var(--kizilcik-charcoal);
  background-image: none;
  box-shadow: none;
}


/* Brand / logo row */

.container-header > .grid-child:not(.container-nav) {
  padding-top: 0.65rem;
  padding-bottom: 0.15rem;
}


/* Logo */

.container-header .navbar-brand {
  margin: 0;
  padding: 0;
  line-height: 1;
}

.container-header .navbar-brand img {
  display: block;
  width: min(430px, 88vw);
  max-width: 100%;
  height: auto;
}


/* Navigation */

.container-header .container-nav {
  align-items: center;
  gap: 1.25rem;
  padding-top: 0.1rem;
  padding-bottom: 0.55rem;
}

.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span {
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li > a:focus {
  color: #ffffff;
}


/* Search */

.container-header .container-search {
  margin-left: auto;
}

.container-header .container-search .form-control {
  width: 11rem;
  max-width: 100%;
}


/* =========================================================
   Main content typography
   ========================================================= */

main h1 {
  font-size: clamp(1.85rem, 2.7vw, 2.2rem);
  line-height: 1.18;
  font-weight: 700;
  margin-bottom: 1rem;
}


/* =========================================================
   Editorial article titles
   Category Blog + Featured Articles homepage
   ========================================================= */


/* Category Blog */

.blog .blog-item .page-header {
  margin-bottom: 0.28rem;
}

.blog .blog-item .page-header h2 {
  margin: 0;
  font-size: clamp(1.5rem, 2vw, 1.75rem);
  line-height: 1.22;
  font-weight: 700;
}


/* Featured Articles homepage */

.blog-featured .blog-item .item-title {
  margin: 0 0 0.28rem;
  font-size: clamp(1.5rem, 2vw, 1.75rem);
  line-height: 1.22;
  font-weight: 700;
}


/* Category article-title links */

.blog .blog-item .page-header h2 a,
.blog .blog-item .page-header h2 a:visited {
  color: var(--kizilcik-text);
  text-decoration: none;
}


/* Featured/homepage article-title links */

.blog-featured .blog-item .item-title a,
.blog-featured .blog-item .item-title a:visited {
  color: var(--kizilcik-text);
  text-decoration: none;
}


/* Hover */

.blog .blog-item .page-header h2 a:hover,
.blog-featured .blog-item .item-title a:hover {
  color: var(--kizilcik-red);
  text-decoration: none;
}


/* Keyboard focus */

.blog .blog-item .page-header h2 a:focus-visible,
.blog-featured .blog-item .item-title a:focus-visible {
  color: var(--kizilcik-red);

  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.16em;

  outline: none;
}


/* =========================================================
   Article metadata
   Author · Category · Publication date
   ========================================================= */

.article-info-term {
  display: none;
}

.article-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  margin-top: 0.3rem;
  margin-bottom: 0.95rem;
  padding: 0;

  color: #626262;
  font-size: 0.88rem;
  line-height: 1.4;
}

.article-info > dd {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

.article-info [class^="icon-"],
.article-info [class*=" icon-"] {
  display: none;
}

.article-info > dd + dd::before {
  content: "·";
  margin-right: 0.55rem;
  margin-left: 0.55rem;
  color: #aaaaaa;
}

.article-info a {
  color: #4f5f70;
  font-weight: 400;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.article-info a:hover,
.article-info a:focus {
  color: var(--kizilcik-red);
  border-bottom-color: var(--kizilcik-red);
}


/* =========================================================
   Article preview rhythm
   ========================================================= */

.blog-item {
  line-height: 1.55;
}

.blog-item p {
  margin-bottom: 0.75rem;
}

.blog-featured .blog-item,
.blog .blog-item {
  margin-bottom: 2.4rem;
}

/* Left-aligned inline article images:
   preserve the traditional small gap before wrapped text */
.com-content-article__body img.float-start,
.blog-item img.float-start {
  margin-right: 5px;
  max-width: 100%;
  height: auto;
}


/* =========================================================
   Additional featured articles
   The short list immediately before pagination
   ========================================================= */

.com-content-blog__links {
  margin: 1.6rem 0 1.25rem;
  padding: 1rem 0 0;

  border-top: 1px solid var(--kizilcik-rule);
  list-style: none;
}

.com-content-blog__link {
  position: relative;

  margin: 0;
  padding: 0 0 0 1rem;

  font-size: 0.94rem;
  line-height: 1.45;
}

.com-content-blog__link + .com-content-blog__link {
  margin-top: 0.38rem;
}


/* Small editorial marker instead of default bullets */

.com-content-blog__link::before {
  content: "—";

  position: absolute;
  left: 0;

  color: #aaaaaa;
}


/* Quiet secondary links */

.com-content-blog__link a,
.com-content-blog__link a:visited {
  color: var(--kizilcik-sidebar-link);
  font-weight: 400;
  text-decoration: none;
}

.com-content-blog__link a:hover,
.com-content-blog__link a:focus {
  color: var(--kizilcik-red);
  text-decoration: none;
}

.com-content-blog__link a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}


/* =========================================================
   Right sidebar
   Modules use noCard + module class kizilcik-sidebar
   ========================================================= */

.container-sidebar-right .kizilcik-sidebar {
  margin: 0 0 1.6rem;
  padding: 0 0 1.25rem;

  border: 0;
  border-bottom: 1px solid var(--kizilcik-rule);
  background: transparent;
}

.container-sidebar-right .kizilcik-sidebar:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}


/* Sidebar headings */

.container-sidebar-right .kizilcik-sidebar > h3 {
  margin: 0 0 0.8rem;
  padding: 0 0 0.45rem;

  border-bottom: 1px solid var(--kizilcik-rule);

  color: #333333;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.025em;
  text-transform: none;
}


/* Sidebar links */

.container-sidebar-right .kizilcik-sidebar a {
  color: var(--kizilcik-sidebar-link);
  font-weight: 400;
  text-decoration: none;
}

.container-sidebar-right .kizilcik-sidebar a:hover,
.container-sidebar-right .kizilcik-sidebar a:focus {
  color: var(--kizilcik-red);
  text-decoration: none;
}


/* Slightly stronger section-navigation links */

.container-sidebar-right .kizilcik-sidebar .mod-menu a {
  font-weight: 500;
}


/* Sidebar lists */

.container-sidebar-right .kizilcik-sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.container-sidebar-right .kizilcik-sidebar li {
  margin: 0;
  padding: 0;
}

.container-sidebar-right .kizilcik-sidebar li + li {
  margin-top: 0.5rem;
}


/* Sidebar images */

.container-sidebar-right .kizilcik-sidebar img {
  display: block;
  max-width: 100%;
  height: auto;
}

.container-sidebar-right .kizilcik-sidebar p:has(img) {
  margin-bottom: 0.55rem;
  text-align: center;
}

.container-sidebar-right .kizilcik-sidebar > :last-child {
  margin-bottom: 0;
}


/* =========================================================
   Breadcrumbs
   ========================================================= */

.mod-breadcrumbs__wrapper {
  margin-bottom: 1rem;
}

.mod-breadcrumbs.breadcrumb {
  margin: 0;
  padding: 0.55rem 0.75rem !important;

  border: 0;
  border-radius: 0;

  background: #f5f5f3;

  color: #666666;
  font-size: 0.86rem;
  line-height: 1.35;
}

.mod-breadcrumbs__divider {
  display: none;
}

.mod-breadcrumbs .breadcrumb-item a {
  color: #52677c;
  text-decoration: none;
}

.mod-breadcrumbs .breadcrumb-item a:hover,
.mod-breadcrumbs .breadcrumb-item a:focus {
  color: var(--kizilcik-red);
  text-decoration: underline;
  text-underline-offset: 0.14em;
}

.mod-breadcrumbs .breadcrumb-item.active {
  color: #555555;
}


/* =========================================================
   Ana kategoriler — visual category navigation
   ========================================================= */

.ana-kategoriler {
  margin-top: 2.25rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--kizilcik-rule);
}


/* Four paintings across on desktop */

.ana-kategoriler-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.35rem;
}


/* Entire painting + label is one link */

.ana-kategori,
.ana-kategori:visited {
  display: block;

  color: var(--kizilcik-text);
  text-align: center;
  text-decoration: none;
}


/* Preserve paintings without cropping */

.ana-kategori img {
  display: block;
  width: 100%;
  height: auto;

  margin: 0 0 0.55rem;

  border: 0;
}


/* Category name */

.ana-kategori span {
  display: inline-block;

  color: #333333;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.3;

  border-bottom: 1px solid transparent;
}


/* Interaction */

.ana-kategori:hover span,
.ana-kategori:focus-visible span {
  color: var(--kizilcik-red);
  border-bottom-color: var(--kizilcik-red);
}

.ana-kategori:focus-visible {
  outline: 2px solid var(--kizilcik-red);
  outline-offset: 4px;
}


/* =========================================================
   Footer
   ========================================================= */

.container-footer {
  margin-top: 2rem;

  background: var(--kizilcik-charcoal);
  background-image: none;

  color: #eeeeee;
}

.container-footer .grid-child {
  display: flex;
  justify-content: center;

  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.container-footer .mod-custom {
  width: 100%;

  color: #eeeeee;
  font-size: 0.86rem;
  line-height: 1.4;
  text-align: center;
}

.container-footer .mod-custom p {
  margin: 0;
}

.container-footer .mod-custom a {
  color: #ffffff;
  text-decoration: none;
  border-bottom: 1px solid #888888;
}

.container-footer .mod-custom a:hover,
.container-footer .mod-custom a:focus {
  color: #ffffff;
  border-bottom-color: var(--kizilcik-red);
}


/* =========================================================
   Responsive refinements
   ========================================================= */

@media (max-width: 991.98px) {

  .container-header .navbar-brand img {
    width: min(360px, 88vw);
  }

  .container-header .container-nav {
    gap: 0.75rem;
  }


  /* Ana kategoriler: 2 × 2 */

  .ana-kategoriler-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }
}


@media (max-width: 575.98px) {

  /* Header */

  .container-header > .grid-child:not(.container-nav) {
    padding-top: 0.5rem;
    padding-bottom: 0.1rem;
  }

  .container-header .container-nav {
    padding-top: 0.1rem;
    padding-bottom: 0.45rem;
  }

  .container-header .navbar-brand img {
    width: min(330px, 92vw);
  }


  /* Reading */

  body {
    line-height: 1.55;
  }


  /* Main heading */

  main h1 {
    font-size: 1.75rem;
  }


  /* Category Blog titles */

  .blog .blog-item .page-header h2 {
    font-size: 1.45rem;
    line-height: 1.23;
  }


  /* Homepage Featured titles */

  .blog-featured .blog-item .item-title {
    font-size: 1.45rem;
    line-height: 1.23;
  }


  /* Metadata */

  .article-info {
    font-size: 0.875rem;
    margin-bottom: 0.75rem;
  }

  .article-info > dd + dd::before {
    margin-right: 0.4rem;
    margin-left: 0.4rem;
  }


  /* Articles */

  .blog-featured .blog-item,
  .blog .blog-item {
    margin-bottom: 2rem;
  }


  /* Additional featured links */

  .com-content-blog__links {
    margin-top: 1.25rem;
    padding-top: 0.8rem;
  }

  .com-content-blog__link {
    font-size: 0.9rem;
  }


  /* Sidebar */

  .container-sidebar-right .kizilcik-sidebar {
    margin-bottom: 1.3rem;
    padding-bottom: 1rem;
  }


  /* Breadcrumbs */

  .mod-breadcrumbs.breadcrumb {
    padding: 0.45rem 0.6rem !important;
    font-size: 0.82rem;
  }


  /* Ana kategoriler */

  .ana-kategoriler {
    margin-top: 1.75rem;
    padding-top: 1rem;
  }

  .ana-kategoriler-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  .ana-kategori span {
    font-size: 0.86rem;
  }


  /* Footer */

  .container-footer {
    margin-top: 1.5rem;
  }

  .container-footer .grid-child {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .container-footer .mod-custom {
    font-size: 0.82rem;
  }
}


/* Very narrow phones */

@media (max-width: 390px) {

  .ana-kategoriler-grid {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   Author → article list
   ========================================================= */

.author-articles {
  margin-top: 0.3rem;
}

.author-articles-list {
  margin: 0;
  padding: 0;
}

.author-article-item {
  margin: 0;
  padding: 0.32rem 0;

  color: var(--kizilcik-muted);
  font-size: 0.94rem;
  line-height: 1.45;
}

.author-article-title,
.author-article-title:visited {
  color: var(--kizilcik-text);
  font-weight: 600;
  text-decoration: none;
}

.author-article-category,
.author-article-category:visited {
  color: #52677c;
  font-weight: 400;
  text-decoration: none;
}

.author-article-date {
  color: #777777;
}

.author-article-separator {
  margin: 0 0.28rem;
  color: #aaaaaa;
}

.author-article-title:hover,
.author-article-title:focus,
.author-article-category:hover,
.author-article-category:focus {
  color: var(--kizilcik-hover);
  text-decoration: none;
}

/* Author page: "Yazılar" heading */
.com-contact > h2 {
  margin-top: 1.1rem;
  margin-bottom: 0.55rem;
  font-size: 1.45rem;
  line-height: 1.2;
  font-weight: 700;
}


/* =========================================================
   Author page — miscellaneous / Külliyat link
   ========================================================= */

/* Hide Joomla's generic "Diğer bilgiler" heading */
.com-contact > h2:has(+ .com-contact__miscinfo),
.com-contact > h3:has(+ .com-contact__miscinfo) {
  display: none;
}

/* Treat Miscellaneous Information as a quiet related resource */
.com-contact__miscinfo {
  margin-top: 0.8rem;
  padding-top: 0.65rem;
  border-top: 1px solid var(--kizilcik-rule);
}

.com-contact__miscinfo dl {
  margin: 0;
}

/* Remove Joomla's information icon / label */
.com-contact__miscinfo dt {
  display: none;
}

.com-contact__miscinfo dd {
  margin: 0;
}

/* TinyMCE may wrap the link in a paragraph */
.com-contact__miscinfo .contact-misc p {
  margin: 0;
}

/* Match the quieter author/category link style */
.com-contact__miscinfo .contact-misc a,
.com-contact__miscinfo .contact-misc a:visited {
  color: #52677c;
  font-weight: 500;
  text-decoration: none;
}

.com-contact__miscinfo .contact-misc a:hover,
.com-contact__miscinfo .contact-misc a:focus {
  color: var(--kizilcik-hover);
  text-decoration: none;
}


/* =========================================================
   Yazarlar directory
   ========================================================= */

.com-contact-category #contactList {
  margin-top: 1rem;
  border: 0;
  border-collapse: collapse;
  background: transparent;
}

/* Remove Cassiopeia / Bootstrap zebra stripes and heavy borders */

.com-contact-category #contactList > tbody > tr > th,
.com-contact-category #contactList > tbody > tr > td {
  background: transparent !important;
  box-shadow: none !important;

  border: 0;
  border-bottom: 1px solid var(--kizilcik-rule);

  padding: 0.65rem 0.55rem;
}

/* Author names */

.com-contact-category #contactList .list-title a,
.com-contact-category #contactList .list-title a:visited {
  color: var(--kizilcik-text);
  font-weight: 600;
  text-decoration: none;
}

/* Very quiet row hover */

.com-contact-category #contactList tbody tr:hover > th,
.com-contact-category #contactList tbody tr:hover > td {
  background: #fafafa !important;
  box-shadow: none !important;
}

.com-contact-category #contactList .list-title a:hover,
.com-contact-category #contactList .list-title a:focus {
  color: var(--kizilcik-hover);
  text-decoration: none;
}


/* Dergi archive: issue contents heading */
body.dergi-arsivi .com-content-article h1 {
  margin-top: 0.45rem;
  margin-bottom: 0.9rem;
  font-size: 1.7rem;
  line-height: 1.2;
  font-weight: 700;
  color: var(--kizilcik-text);
}

/* Neutralise legacy inline link colours inside old issue contents */
body.dergi-arsivi .com-content-article__body a span {
  color: inherit !important;
}

/* Links inside the historical issue contents */
body.dergi-arsivi .com-content-article__body a,
body.dergi-arsivi .com-content-article__body a:visited {
  color: var(--kizilcik-text);
  font-weight: 600;
  text-decoration: none;
}


/* Author/contact links: quieter than article titles */
body.dergi-arsivi .com-content-article__body a[href*="/yazarlar/"],
body.dergi-arsivi .com-content-article__body a[href*="/yazarlar/"]:visited {
  color: var(--kizilcik-muted);
  font-weight: 400;
}


/* Hover */
body.dergi-arsivi .com-content-article__body a:hover,
body.dergi-arsivi .com-content-article__body a:focus {
  color: var(--kizilcik-hover);
  text-decoration: none;
}


/* =========================================================
   Smart Search
   ========================================================= */


/* ---------------------------------------------------------
   Header search — magnifier only
   The "Arama" text remains in the HTML for accessibility,
   but is visually hidden.
   --------------------------------------------------------- */

.container-header .mod-finder__search .btn[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 3rem;
  min-width: 3rem;
  padding-left: 0.7rem;
  padding-right: 0.7rem;

  font-size: 0;
  line-height: 1;
}

.container-header .mod-finder__search .btn[type="submit"] .icon-search {
  margin: 0;
  font-size: 1.05rem;
}


/* ---------------------------------------------------------
   Search results page
   The header already contains the search field, so hide
   Joomla's redundant "Arama Terimleri" form.
   --------------------------------------------------------- */

/* Hide the second search form only once a search is being performed.
   On the bare "Arama" page, keep the form so the page is not empty. */
.com-finder:has(.com-finder__results) > .com-finder__form {
  display: none;
}


/* ---------------------------------------------------------
   Results list
   --------------------------------------------------------- */

.com-finder__results-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.com-finder .result__item {
  margin: 0;
  padding: 0.4rem 0 1.1rem;

  border-bottom: 1px solid var(--kizilcik-rule);
}

.com-finder .result__item + .result__item {
  padding-top: 1rem;
}


/* ---------------------------------------------------------
   Result titles
   Calm editorial styling, similar to Yazarlar.
   --------------------------------------------------------- */

.com-finder .result__title {
  margin: 0 0 0.18rem;
}

.com-finder .result__title-link,
.com-finder .result__title-link:visited {
  color: var(--kizilcik-text);
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.35;

  text-decoration: none;
}

.com-finder .result__title-link:hover,
.com-finder .result__title-link:focus {
  color: var(--kizilcik-hover);
  text-decoration: none;
}

.com-finder .result__title-link:focus-visible {
  color: var(--kizilcik-hover);

  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.15em;

  outline: none;
}


/* ---------------------------------------------------------
   Description / excerpt
   --------------------------------------------------------- */

.com-finder .result__description {
  margin: 0.15rem 0 0.3rem;

  color: var(--kizilcik-text);
  line-height: 1.55;
}

.com-finder .result__date {
  color: var(--kizilcik-muted);
}


/* ---------------------------------------------------------
   Result metadata

   Keep taxonomy enabled in Smart Search so Author and
   Category remain available, but remove the redundant
   "Tür: Makale" entry.

   Also hide labels such as "Yazar:" and "Kategori:" so the
   presentation resembles the Yazarlar article listing.
   --------------------------------------------------------- */

.com-finder .result__taxonomy--Type {
  display: none;
}

.com-finder .result__taxonomy {
  display: flex;
  flex-wrap: wrap;

  margin: 0.2rem 0 0;
  padding: 0;

  color: #52677c;
  font-size: 0.9rem;
  line-height: 1.4;

  list-style: none;
}

.com-finder .result__taxonomy-item {
  margin: 0;
  padding: 0;
}

/* Hide "Yazar:", "Kategori:", etc. */
.com-finder .result__taxonomy-item > span {
  display: none;
}

/* Remove Joomla's default "|" taxonomy separators */
.com-finder .result__taxonomy-item + .result__taxonomy-item {
  margin-inline-start: 0;
}

.com-finder .result__taxonomy-item + .result__taxonomy-item::before {
  content: none;
  padding-inline-end: 0;
}

/* Quiet separator between remaining metadata items */
.com-finder
  .result__taxonomy-item:not(.result__taxonomy--Type)
  + .result__taxonomy-item:not(.result__taxonomy--Type)::before {
  content: "·";
  margin: 0 0.45rem;
  color: #aaaaaa;
}