/* ===========================================================
   Golden Gate Global — brand overrides on top of Fablio theme
   Loaded LAST so it wins. Keep edits here, not in theme CSS.
   Palette: navy #15223b  ·  antique gold #C8A24C  ·  deep gold #b8912f
   =========================================================== */

:root{
  --gg-navy:#15223b;
  --gg-gold:#C8A24C;
  --gg-gold-deep:#b8912f;
  --gg-cream:#F6F1E6;
}

/* Filled gold buttons need dark text for contrast (white on gold is unreadable) */
.ttm-btn.ttm-btn-style-fill.ttm-btn-color-skincolor{
  color:var(--gg-navy)!important;
  font-weight:600;
  border-color:var(--gg-gold);
}
.ttm-btn.ttm-btn-style-fill.ttm-btn-color-skincolor:hover{
  background-color:var(--gg-navy)!important;
  border-color:var(--gg-navy)!important;
  color:#fff!important;
}

/* Gold background blocks: ensure readable dark text inside */
.ttm-bgcolor-skincolor,
.ttm-bgcolor-skincolor h1,.ttm-bgcolor-skincolor h2,.ttm-bgcolor-skincolor h3,
.ttm-bgcolor-skincolor h4,.ttm-bgcolor-skincolor h5,.ttm-bgcolor-skincolor h6,
.ttm-bgcolor-skincolor p{
  color:var(--gg-navy);
}

/* Inline gold text links: nudge toward deep gold for legibility on white */
.ttm-btn.btn-inline.ttm-btn-color-skincolor{ color:var(--gg-gold-deep); }
.ttm-btn.btn-inline.ttm-btn-color-skincolor:hover{ color:var(--gg-navy); }

/* Brand selection + focus accents */
::selection{ background:var(--gg-gold); color:var(--gg-navy); }

/* Combined logo (emblem + GOLDENGATE wordmark, 883x240). Header & footer same size. */
#logo-img, #footer-logo-img{ height:40px!important; width:auto!important; max-width:none!important; max-height:none!important; }

/* Turkish text: avoid awkward hyphen breaks in headings */
h1,h2,h3{ hyphens:none; }

/* Uniform product/category card images */
.featured-imagebox.featured-imagebox-services .featured-thumbnail img,
.featured-imagebox.featured-imagebox-services.style1 .featured-thumbnail img{
  width:100%!important; height:240px!important; object-fit:cover!important; display:block;
}
.featured-imagebox.featured-imagebox-services .featured-thumbnail{ overflow:hidden; }
.featured-imagebox-services .featured-content{ padding:22px 24px 26px; }
.featured-imagebox-services{ height:100%; background:#fff; box-shadow:0 6px 24px rgba(21,34,59,.07); border-radius:6px; overflow:hidden; }

/* Fablio-style shine sweep on card images on hover (products, categories, posts) */
.featured-imagebox .featured-thumbnail{ position:relative; overflow:hidden; }
.featured-imagebox .featured-thumbnail::after{
  content:''; position:absolute; top:0; left:-75%; width:50%; height:100%; display:block; z-index:2; pointer-events:none;
  background:linear-gradient(to right, rgba(255,255,255,0) 0, rgba(255,255,255,.35) 100%);
  transform:skewX(-25deg);
}
.featured-imagebox:hover .featured-thumbnail::after{ animation:shine .9s; }

/* Product detail gallery + hover magnifier zoom */
.gg-pg-main{ position:relative; overflow:hidden; border-radius:6px; background:#f3f4f6; cursor:zoom-in; }
.gg-pg-main img{ display:block; width:100%; transition:transform .2s ease-out; }
.gg-pg-main.zooming img{ transform:scale(2.3); }
.gg-pg-hint{ position:absolute; top:12px; right:12px; width:34px; height:34px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(21,34,59,.6); color:#fff; font-size:16px; pointer-events:none; transition:opacity .2s; }
.gg-pg-main.zooming .gg-pg-hint{ opacity:0; }
.gg-pg-thumbs{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.gg-pg-thumb{ width:78px; height:60px; border:2px solid #e6e8ec; border-radius:6px; overflow:hidden; padding:0; background:none; cursor:pointer; transition:border-color .2s; }
.gg-pg-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.gg-pg-thumb.active, .gg-pg-thumb:hover{ border-color:var(--gg-gold,#C8A24C); }
html[dir="rtl"] .gg-pg-hint{ right:auto; left:12px; }

/* Recent-post thumbnails: no rounded corners (override theme's .footer .widget rule) */
.widget-recent-post ul.ttm-recent-post-list > li img,
.footer .widget ul.ttm-recent-post-list > li img{ border-radius:0 !important; }
/* Category intro highlight spacing */
.ttm-bg-highlight .ttm-list li{ margin-bottom:8px; }

/* Hero scrim for text legibility over bright photos (slide_img stays absolute from main.css) */
.banner_slider .slide_img::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:radial-gradient(120% 100% at 50% 50%, rgba(14,22,38,.66) 0%, rgba(14,22,38,.44) 55%, rgba(14,22,38,.34) 100%);
}
.banner_slider .slide__content{ position:relative; z-index:2; }
.banner_slider .slide__content--headings h2,
.banner_slider .slide__content--headings h3,
.banner_slider .slide__content--headings p{ text-shadow:0 2px 16px rgba(0,0,0,.5); }

/* Language switcher: globe icon + dropdown (TR / EN / AR) */
.gg-lang{ position:relative; display:inline-block; }
.gg-lang__toggle{ display:inline-flex; align-items:center; gap:6px; background:transparent; border:1px solid rgba(21,34,59,.18); border-radius:6px; padding:6px 10px; color:var(--gg-navy,#15223b); font-weight:700; font-size:13px; letter-spacing:.5px; line-height:1; cursor:pointer; transition:border-color .2s,color .2s; }
.gg-lang__toggle:hover{ border-color:var(--gg-gold,#C8A24C); color:var(--gg-gold,#C8A24C); }
.gg-lang__toggle .ti-world{ font-size:16px; }
.gg-lang__caret{ font-size:9px; transition:transform .2s; }
.gg-lang.open .gg-lang__caret{ transform:rotate(180deg); }
.gg-lang__menu{ position:absolute; top:calc(100% + 8px); right:0; min-width:160px; background:#fff; border:1px solid rgba(21,34,59,.1); border-radius:8px; box-shadow:0 12px 32px rgba(21,34,59,.16); list-style:none; margin:0; padding:6px; opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .18s,transform .18s,visibility .18s; z-index:30; }
.gg-lang:hover .gg-lang__menu, .gg-lang.open .gg-lang__menu{ opacity:1; visibility:visible; transform:translateY(0); }
.gg-lang__menu li{ margin:0; }
.gg-lang__menu a{ display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:6px; color:var(--gg-navy,#15223b); font-size:14px; font-weight:500; white-space:nowrap; transition:background .15s,color .15s; }
.gg-lang__menu a:hover{ background:var(--gg-cream,#F6F1E6); }
.gg-lang__menu a.active{ color:var(--gg-gold-deep,#b8912f); font-weight:700; }
.gg-lang__code{ display:inline-block; min-width:28px; font-size:11px; font-weight:700; letter-spacing:.5px; color:#fff; background:var(--gg-navy,#15223b); border-radius:4px; padding:3px 5px; text-align:center; }
/* Raise the floating desktop nav above the hero so dropdowns (language + Ürünler) paint on top */
.ttm-header-style-01 .site-header-menu .site-navigation{ z-index:60; }

/* Floating WhatsApp button (bottom-right); scroll-to-top stacks above it */
.gg-whatsapp{
  position:fixed; right:24px; bottom:24px; z-index:998;
  width:58px; height:58px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#25D366; color:#fff !important; font-size:32px; text-decoration:none;
  box-shadow:0 8px 24px rgba(37,211,102,.45);
  transition:transform .2s, box-shadow .2s;
}
.gg-whatsapp:hover{ transform:scale(1.08); color:#fff !important; box-shadow:0 12px 30px rgba(37,211,102,.6); }
.gg-whatsapp i{ line-height:1; }
.gg-whatsapp::after{ content:""; position:absolute; inset:0; border-radius:50%; animation:ggwa-pulse 2.2s infinite; }
@keyframes ggwa-pulse{ 0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);} 70%{box-shadow:0 0 0 16px rgba(37,211,102,0);} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0);} }
#totop{ bottom:96px !important; }
#totop.top-visible{ animation:none !important; }

/* Web design credit (payfabilisim) — static, in footer bottom bar, do-follow */
.gg-bottom-bar{ gap:14px; }
.gg-bottom-copy{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.gg-credit{ display:inline-flex; align-items:center; gap:7px; padding:5px 11px 5px 7px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:8px;
  text-decoration:none; transition:background .2s, border-color .2s; }
.gg-credit:hover{ background:rgba(255,255,255,.12); border-color:var(--gg-gold,#C8A24C); }
.gg-credit img{ width:20px; height:20px; display:block; border-radius:4px; }
.gg-credit span{ color:#fff; font-size:12px; font-weight:600; letter-spacing:.2px; white-space:nowrap; }
@media (max-width:767px){ .gg-bottom-bar{ justify-content:center !important; text-align:center; } .gg-bottom-copy{ justify-content:center; } }

/* Keep the language switcher usable on mobile/tablet (Fablio hides .header_extra < 1200px) */
@media (max-width: 1199px){
  /* Give the mobile header room: smaller logo, compact borderless globe switcher. */
  #logo-img{ height:36px !important; }
  /* .btn-show-menu-mobile is position:absolute (right:0 of .site-navigation); pin the
     language switcher just to its left so they never overlap. */
  .header_extra{ display:flex !important; visibility:visible !important; align-items:center;
    position:absolute; right:56px; top:50%; transform:translateY(-50%); margin:0; z-index:20; }
  .gg-lang__toggle{ border-color:transparent; padding:6px 4px; gap:3px; }
  .gg-lang__toggle .gg-lang__cur{ display:none; }     /* globe speaks for itself on mobile */
  .gg-lang__toggle .ti-world{ font-size:22px; }
  .gg-lang__menu{ right:0; left:auto; }
  /* RTL (Arabic): logo sits on the right (space-between flips), so move the hamburger
     and language switcher to the LEFT, otherwise they overlap the logo on the right. */
  html[dir="rtl"] .btn-show-menu-mobile{ right:auto !important; left:0 !important; }
  html[dir="rtl"] .header_extra{ right:auto; left:56px; }
  html[dir="rtl"] .gg-lang__menu{ right:auto; left:0; }
}
@media (max-width:575px){ .gg-whatsapp{ width:52px; height:52px; font-size:28px; right:16px; bottom:16px; } #totop{ bottom:82px !important; } }
.gg-lang__menu a.active .gg-lang__code{ background:var(--gg-gold,#C8A24C); color:var(--gg-navy,#15223b); }

/* --- Arabic RTL --- */
html[dir="rtl"] .widget_contact_wrapper li,
html[dir="rtl"] .ttm-list li,
html[dir="rtl"] .featured-content,
html[dir="rtl"] .post-detail,
html[dir="rtl"] .sidebar .widget,
html[dir="rtl"] .footer .widget{ text-align:right; }
html[dir="rtl"] .ttm-list li{ padding-left:0; padding-right:25px; }
html[dir="rtl"] .widget_info{ padding-left:0; padding-right:50px; }
html[dir="rtl"] .gg-lang__menu{ right:auto; left:0; }
html[dir="rtl"] .header_extra{ justify-content:flex-start !important; }

/* Inner-page banner: on desktop (>=1200px) the header floats over the banner
   (position:absolute; top:40px; ~100px tall → bottom ~140px), covering the
   title. Push the title+breadcrumb below it and centre them in the band. */
@media (min-width: 1200px){
  .ttm-page-title-row-inner{ padding-top:185px; padding-bottom:45px; }
}
