/* ============================================================
      ============================================================
      FOTO GALERİ DETAY SAYFASI (page-gallery)
      ============================================================
      ============================================================ */
   body.page-gallery { background: #0A0A0A; color: #E5E5E5; }
   body.page-gallery #breadcrumb { background: #111; border-bottom-color: #222; }
   body.page-gallery .bc-list, body.page-gallery .bc-list a { color: #888; }
   body.page-gallery .bc-list a:hover { color: #fff; }
   body.page-gallery .bc-current { color: #fff; }

   #gallery-main { padding: 16px 0 40px; }
   .fg-hero {
     position: relative; overflow: hidden;
     border-radius: 8px; margin-bottom: 18px;
     min-height: 460px; display: flex; align-items: center;
   }
   .fg-hero-img { position: absolute; inset: 0; }
   .fg-hero-img img { width: 100%; height: 100%; object-fit: cover; }
   .fg-hero-overlay {
     position: absolute; inset: 0;
     background: linear-gradient(135deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.4) 60%, transparent 100%);
   }
   .fg-hero-info {
     position: relative; z-index: 2;
     padding: 36px 44px; max-width: 720px;
   }
   .fg-eyebrow {
     display: inline-flex; align-items: center; gap: 7px;
     font-family: 'Oswald', sans-serif; font-size: 11.5px; letter-spacing: .1em;
     background: rgba(255,255,255,.1); color: #fff;
     padding: 5px 11px; border-radius: 3px;
     backdrop-filter: blur(6px);
     border: 1px solid rgba(255,255,255,.18);
     margin-bottom: 12px;
   }
   .fg-hero-info h1 {
     font-family: 'Merriweather', serif;
     font-size: 42px; line-height: 1.15; font-weight: 900;
     color: #fff; margin-bottom: 12px; text-shadow: 0 2px 10px rgba(0,0,0,.4);
   }
   .fg-hero-info > p { font-size: 16px; color: rgba(255,255,255,.85); line-height: 1.6; margin-bottom: 22px; }
   .fg-meta {
     display: flex; gap: 22px; align-items: center; flex-wrap: wrap;
     padding: 14px 16px;
     background: rgba(0,0,0,.4); border-radius: 8px;
     border: 1px solid rgba(255,255,255,.08);
     margin-bottom: 18px;
   }
   .fg-author { display: flex; gap: 10px; align-items: center; }
   .fg-author img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; border: 2px solid #fff; }
   .fg-author strong { display: block; color: #fff; font-size: 13.5px; }
   .fg-author small { display: block; color: rgba(255,255,255,.65); font-size: 11.5px; }
   .fg-stats { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: rgba(255,255,255,.7); }
   .fg-stats i { margin-right: 4px; opacity: .8; }
   .fg-hero-actions { display: flex; gap: 8px; flex-wrap: wrap; }
   .fg-hero .btn-primary { background: #fff; color: #0A0A0A; }
   .fg-hero .btn-primary:hover { background: rgba(255,255,255,.85); }
   .fg-hero .btn-outline { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.05); }
   .fg-hero .btn-outline:hover { background: rgba(255,255,255,.12); border-color: #fff; }

   /* Chips */
   .fg-chips {
     display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px;
     padding: 12px 14px;
     background: #111; border: 1px solid #222; border-radius: 8px;
   }
   .fg-chip {
     background: transparent; color: rgba(255,255,255,.75);
     border: 1px solid #333; padding: 7px 14px; border-radius: 18px;
     font-family: inherit; font-size: 12.5px; cursor: pointer;
     transition: all .15s;
     display: inline-flex; align-items: center; gap: 6px;
   }
   .fg-chip i { font-size: 11px; opacity: .7; }
   .fg-chip:hover { background: #222; color: #fff; }
   .fg-chip.active { background: #fff; color: #0A0A0A; border-color: #fff; }
   .fg-chip.active i { opacity: 1; }

   /* Grid */
   .fg-grid {
     display: grid; grid-template-columns: repeat(4, 1fr);
     grid-auto-rows: 220px;
     gap: 8px; margin-bottom: 18px;
   }
   .fg-item {
     position: relative; overflow: hidden; cursor: pointer;
     padding: 0; background: #111; border: none; border-radius: 4px;
     transition: transform .2s; outline: none;
   }
   .fg-item.fg-large { grid-column: span 2; grid-row: span 1; }
   .fg-item.fg-tall  { grid-row: span 2; }
   .fg-item.fg-wide  { grid-column: span 2; }
   .fg-item img {
     width: 100%; height: 100%; object-fit: cover;
     transition: filter .25s;
   }
   .fg-item:hover img { filter: brightness(1.1); }
   .fg-item.hidden { display: none; }
   .fg-overlay {
     position: absolute; inset: 0;
     background: linear-gradient(to top, rgba(0,0,0,.65) 0%, transparent 50%);
     display: flex; align-items: center; justify-content: center;
     opacity: 0; transition: opacity .2s;
   }
   .fg-item:hover .fg-overlay { opacity: 1; }
   .fg-overlay i { color: #fff; font-size: 28px; text-shadow: 0 2px 8px rgba(0,0,0,.5); }
   .fg-caption {
     position: absolute; bottom: 0; left: 0; right: 0;
     padding: 10px 12px;
     color: #fff; font-size: 12.5px; font-weight: 600;
     background: linear-gradient(to top, rgba(0,0,0,.85), transparent);
     display: flex; align-items: center; gap: 6px;
     opacity: 0; transform: translateY(8px); transition: all .25s;
   }
   .fg-item:hover .fg-caption { opacity: 1; transform: translateY(0); }
   .fg-caption span {
     font-family: 'Oswald', sans-serif; font-size: 10.5px;
     background: rgba(255,255,255,.15); color: #fff; padding: 1px 6px; border-radius: 2px;
     border: 1px solid rgba(255,255,255,.2);
   }

   .fg-load-more { text-align: center; margin-bottom: 30px; }
   .fg-load-more .btn-outline { color: #fff; border-color: #333; background: #1a1a1a; padding: 12px 24px; }
   .fg-load-more .btn-outline:hover { background: #fff; color: #0A0A0A; }

   /* Photographer bio */
   .fg-bio {
     display: flex; gap: 20px; align-items: flex-start;
     background: #111; border: 1px solid #222; border-radius: 8px;
     padding: 24px 28px; margin-bottom: 30px;
   }
   .fg-bio img {
     width: 96px; height: 96px; border-radius: 50%; object-fit: cover;
     border: 3px solid #fff; flex-shrink: 0;
   }
   .fg-bio > div { flex: 1; min-width: 0; }
   .fg-bio small {
     display: block; font-family: 'Oswald', sans-serif; font-size: 11px;
     letter-spacing: .12em; color: #888; margin-bottom: 4px;
   }
   .fg-bio h3 { font-family: 'Merriweather', serif; font-size: 20px; color: #fff; margin-bottom: 8px; }
   .fg-bio p { font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.75); margin-bottom: 14px; }
   .fg-bio-actions { display: flex; gap: 8px; flex-wrap: wrap; }
   .fg-bio-actions .btn-outline {
     color: #fff; border-color: rgba(255,255,255,.2); background: transparent;
     padding: 6px 12px; font-size: 12px;
   }
   .fg-bio-actions .btn-outline:hover { background: #fff; color: #0A0A0A; }

   /* Related galleries */
   .fg-related h2 {
     font-family: 'Merriweather', serif;
     font-size: 22px; color: #fff; margin-bottom: 16px;
     padding-left: 12px; border-left: 4px solid #fff;
   }
   .fg-related h2 i { color: #fff; margin-right: 8px; }
   .fg-rel-grid {
     display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
   }
   .fgr-card {
     background: #111; border: 1px solid #222; border-radius: 8px; overflow: hidden;
     transition: border-color .2s;
     text-decoration: none; color: inherit;
   }
   .fgr-card:hover { border-color: #fff; }
   .fgr-card img { width: 100%; height: 140px; object-fit: cover; }
   .fgr-card > div { padding: 12px 14px 14px; }
   .fgr-count {
     display: inline-flex; align-items: center; gap: 5px;
     font-family: 'Oswald', sans-serif; font-size: 10.5px; letter-spacing: .06em;
     background: rgba(255,255,255,.08); color: #fff; padding: 2px 7px;
     border-radius: 2px; margin-bottom: 6px;
   }
   .fgr-card strong { display: block; font-size: 14px; color: #fff; margin-bottom: 4px; line-height: 1.35; }
   .fgr-card small { font-size: 11.5px; color: #888; }

   /* LIGHTBOX */
   .fg-lightbox {
     position: fixed; inset: 0; z-index: 1000;
     background: rgba(0,0,0,.96);
     display: none; flex-direction: column;
   }
   .fg-lightbox.open { display: flex; }
   .fgl-close, .fgl-prev, .fgl-next {
     position: absolute; z-index: 5;
     background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.15);
     width: 50px; height: 50px; border-radius: 50%;
     display: flex; align-items: center; justify-content: center;
     font-size: 18px; cursor: pointer;
     transition: all .15s;
   }
   .fgl-close:hover, .fgl-prev:hover, .fgl-next:hover { background: rgba(255,255,255,.2); }
   .fgl-close { top: 18px; right: 18px; }
   .fgl-prev { left: 18px; top: 50%; transform: translateY(-50%); }
   .fgl-next { right: 18px; top: 50%; transform: translateY(-50%); }
   .fgl-stage {
     flex: 1; display: flex; align-items: center; justify-content: center;
     padding: 60px 80px 20px;
     min-height: 0;
   }
   .fgl-stage img {
     max-width: 100%; max-height: 100%; object-fit: contain;
     box-shadow: 0 20px 60px rgba(0,0,0,.6);
   }
   .fgl-bar {
     display: flex; align-items: center; justify-content: space-between;
     gap: 14px; padding: 12px 28px;
     background: rgba(0,0,0,.4); border-top: 1px solid rgba(255,255,255,.08);
     flex-wrap: wrap;
   }
   .fgl-info { color: #fff; font-size: 13.5px; display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; }
   .fgl-counter strong { font-family: 'Oswald', sans-serif; font-size: 16px; }
   .fgl-cap { color: rgba(255,255,255,.7); }
   .fgl-actions { display: flex; gap: 6px; }
   .fgl-actions button {
     background: rgba(255,255,255,.08); border: none; color: #fff;
     width: 36px; height: 36px; border-radius: 50%; cursor: pointer;
     transition: background .15s;
   }
   .fgl-actions button:hover { background: rgba(255,255,255,.2); }
   .fgl-actions button.active { background: var(--red); }

   .fgl-strip {
     display: flex; gap: 6px; overflow-x: auto;
     padding: 10px 14px; background: rgba(0,0,0,.5);
   }
   .fgl-strip button {
     width: 70px; height: 50px; border: 2px solid transparent;
     padding: 0; background: #000; border-radius: 3px; overflow: hidden;
     flex-shrink: 0; cursor: pointer; opacity: .55;
     transition: all .15s;
   }
   .fgl-strip button img { width: 100%; height: 100%; object-fit: cover; }
   .fgl-strip button:hover { opacity: 1; }
   .fgl-strip button.active { border-color: #fff; opacity: 1; }

   @media (max-width: 900px) {
     .fg-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 200px; }
     .fg-item.fg-large { grid-column: span 2; }
     .fg-item.fg-tall { grid-row: span 2; }
     .fg-rel-grid { grid-template-columns: repeat(2, 1fr); }
     .fg-hero-info { padding: 24px 22px; }
     .fg-hero-info h1 { font-size: 28px; }
     .fgl-stage { padding: 60px 12px 16px; }
     .fgl-close, .fgl-prev, .fgl-next { width: 40px; height: 40px; font-size: 14px; }
   }
   @media (max-width: 540px) {
     .fg-grid { grid-template-columns: 1fr; grid-auto-rows: 220px; }
     .fg-item.fg-large, .fg-item.fg-tall, .fg-item.fg-wide { grid-column: auto; grid-row: auto; }
     .fg-bio { flex-direction: column; align-items: center; text-align: center; }
   }
   

/* Shared light components on the dark gallery page:
   comments sit on their own paper panel; the caption text turns light. */
body.page-gallery .nd-comments { background: #fff; color: var(--text); border-radius: 6px; padding: 24px; }
body.page-gallery .fd-wrap .article-body,
body.page-gallery .fd-wrap .article-body p strong { color: #E5E5E5; }
body.page-gallery .fd-wrap .article-body em { color: #C8C8C8; }
body.page-gallery .fd-wrap .article-body a { color: #FF8A99; }