/* TAGANI HUB brand system -- additive, does not touch theme/plugin files */
:root{
  --tg-navy:#0B1F3A;
  --tg-sky:#38BDF8;
  --tg-orange:#F97316;
  --tg-orange-hover:#EA6A0C;
  --tg-white:#FFFFFF;
  --tg-light-blue:#F0F9FF;
  --tg-neutral:#F8FAFC;
  --tg-text:#0F172A;
  --tg-text-secondary:#64748B;
  --tg-success:#16A34A;
  --tg-error:#DC2626;
  --tg-font:'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

body, p, li, td, span, input, textarea, select, button {
  font-family: var(--tg-font);
  color: var(--tg-text);
}
h1,h2,h3,h4,h5,h6, .site-title, .widget-title, .rtcl-listing-title, .rtcl-item-title {
  font-family: var(--tg-font);
  color: var(--tg-navy);
}
h1{font-weight:800;}
h2{font-weight:700;}
h3,h4{font-weight:600;}
body{font-weight:400;}
.main-navigation-area, .main-navigation-area a, .rt-header-menu a {
  font-family: var(--tg-font);
  font-weight:500;
  color: var(--tg-navy);
}
a{ color: var(--tg-sky); }
a:hover{ color:#0284C7; }

/* Primary CTA -- "Publier une annonce" -- reserved for this action only */
.header-btn, .header-btn.header-menu-btn-mob {
  background:var(--tg-orange) !important;
  color:var(--tg-white) !important;
  border-radius:9px !important;
  font-weight:700 !important;
  border:none !important;
  transition:background-color .2s ease, transform .1s ease;
}
.header-btn:hover, .header-btn:focus {
  background:var(--tg-orange-hover) !important;
  color:var(--tg-white) !important;
  transform:translateY(-1px);
}
.header-btn:active { transform:translateY(0); }
.header-btn:focus-visible { outline:2px solid var(--tg-navy); outline-offset:2px; }

/* Secondary buttons -- sky blue / outlined navy, never orange */
.rtcl-btn:not(.header-btn):not(.rtcl-btn-danger),
.rtcl-btn-primary {
  background:var(--tg-white);
  color:var(--tg-navy);
  border:1.5px solid var(--tg-sky);
  font-weight:600;
  border-radius:8px;
}
.rtcl-btn:not(.header-btn):not(.rtcl-btn-danger):hover {
  background:var(--tg-light-blue);
}
.rtcl-btn-danger { color:var(--tg-error); border-color:var(--tg-error); }

/* Listing cards */
.rtcl-listing-item, .rtcl-widget-listing-item {
  background:var(--tg-white) !important;
  border:1px solid #E2E8F0 !important;
  box-shadow:0 1px 3px rgba(11,31,58,0.06) !important;
  border-radius:10px;
}
.rtcl-listing-title, .rtcl-listing-title a { color:var(--tg-navy) !important; font-weight:600; }
.listing-price { color:var(--tg-navy) !important; font-weight:700; }
.rtcl-listing-item .rtcl-favourites,
.rtcl-listing-item .rtcl-icon-heart,
.rtcl-listing-item .rtcl-icon-heart-empty { color:var(--tg-orange); }

/* Category boxes */
.cat-item-wrap, .rt-el-listing-cat-box-1, .rt-el-listing-cat-box-2, .rtcl-gb-cat-box {
  background:var(--tg-white);
  transition:background-color .2s ease, border-color .2s ease;
}
.cat-item-wrap:hover, .rt-el-listing-cat-box-1:hover, .rt-el-listing-cat-box-2:hover {
  background:var(--tg-light-blue);
}
.cat-item-wrap .rtcl-icon, .rt-el-listing-cat-box-1 i, .rt-el-listing-cat-box-2 i {
  color:var(--tg-sky);
}

/* Filters -- sky blue selected/active states, never orange (orange reserved for primary CTA) */
.rtcl-filter-checkbox:checked,
.rtcl-form-checkbox-group input:checked,
.rtcl-form-radio-group input:checked {
  accent-color:var(--tg-sky);
}
.is-active, .rtclbh-active {
  color:var(--tg-sky) !important;
  border-color:var(--tg-sky) !important;
}

/* Forms */
.rtcl-form-control, input.rtcl-form-control, textarea.rtcl-form-control, select.rtcl-form-control {
  background:var(--tg-white);
  border:1.5px solid #CBD5E1;
  border-radius:8px;
  color:var(--tg-text);
  min-height:44px;
}
.rtcl-form-control:focus {
  border-color:var(--tg-sky) !important;
  box-shadow:0 0 0 3px rgba(56,189,248,0.25) !important;
  outline:none;
}
label { color:var(--tg-navy); font-weight:500; }

/* Footer */
.footer-style-2, .footer-top-area, .footer-bottom-area {
  background:var(--tg-navy) !important;
  color:var(--tg-white);
}
.footer-style-2 a, .footer-top-area a, .footer-bottom-area a {
  color:#BAE6FD;
}
.footer-style-2 a:hover, .footer-top-area a:hover { color:var(--tg-sky); }
.footer-style-2 .widget-title, .footer-top-area .widget-title { color:var(--tg-white); }

/* Backgrounds -- keep mostly white, very light blue only for alternating sections */
body { background:var(--tg-white); }

/* Logo sizing safety net: never let the logo exceed a sane box even if
   theme CSS or a future setting change reintroduces the old bug. */
.site-branding img { max-width:200px; max-height:60px; width:auto; height:auto; }
/* Mid-homepage CTA section */
.tagani-mid-cta { padding:64px 20px; text-align:center; }
.tagani-mid-cta-inner { max-width:680px; margin:0 auto; }
.tagani-mid-cta-eyebrow { color:#38BDF8; font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:14px; margin-bottom:8px; }
.tagani-mid-cta-heading { color:#0B1F3A; font-weight:800; font-size:32px; margin:0 0 16px; }
.tagani-mid-cta-sub { color:#475569; font-size:17px; line-height:1.6; margin:0 0 24px; }
.tagani-mid-cta-benefits { list-style:none; padding:0; margin:0 0 32px; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 28px; }
.tagani-mid-cta-benefits li { color:#0F172A; font-weight:500; }
.tagani-mid-cta-benefits li::before { content:"\2713"; color:#16A34A; font-weight:700; margin-right:6px; }
.tagani-mid-cta-buttons { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; }
.tagani-cta-btn { display:inline-block; padding:14px 28px; border-radius:9px; font-weight:700; text-decoration:none; font-size:16px; min-height:44px; line-height:1.2; }
.tagani-cta-btn-primary { background:#F97316; color:#FFFFFF; }
.tagani-cta-btn-primary:hover { background:#EA6A0C; color:#FFFFFF; }
.tagani-cta-btn-secondary { background:#FFFFFF; color:#0B1F3A; border:1.5px solid #38BDF8; }
.tagani-cta-btn-secondary:hover { background:#F0F9FF; }
@media (max-width:480px) {
  .tagani-mid-cta-buttons { flex-direction:column; }
  .tagani-cta-btn { width:100%; text-align:center; }
  .tagani-mid-cta-heading { font-size:26px; }
}
/* Header background safety net -- explicit white on every header container,
   and a guaranteed-visible logo background regardless of any other rule. */
.site-header, .main-header, #site-header, .header-top-bar,
.main-header .site-branding, .site-branding {
  background-color: #FFFFFF !important;
}
.site-branding img { background-color: transparent; }
.main-navigation-area, .rt-header-menu { background-color: #FFFFFF !important; }
/* Hero: swap to the cropped, subject-focused mobile image below tablet width */
@media (max-width: 767px) {
  .elementor-element-4ab08553 {
    background-image: url('https://taganihub.com/wp-content/uploads/tagani-branding/hero-mobile.jpg') !important;
    background-position: center top !important;
    background-size: cover !important;
  }
}
/* Mobile hamburger menu: force visible text color (was falling back to a
   white default meant for the old dark menu background). */
.mean-container .mean-nav ul li a,
.mean-container .mean-nav ul li a:link,
.mean-container .mean-nav ul li a:visited {
  color: #0B1F3A !important;
}
.mean-container .mean-nav ul li a:hover,
.mean-container .mean-nav > ul > li.current-menu-item > a {
  color: #38BDF8 !important;
}
.mean-container .mean-nav ul li {
  border-color: #E2E8F0 !important;
}
/* Mobile: center section content (was left-aligned by default in some
   sections) and give icon-over-text blocks proper spacing so the icon
   never overlaps the heading/text beneath it. */
@media (max-width: 767px) {
  .elementor-widget-icon-box .elementor-icon-box-wrapper {
    text-align: center !important;
    align-items: center !important;
  }
  .elementor-widget-icon-box .elementor-icon-box-icon {
    margin-bottom: 16px !important;
  }
  .elementor-widget-icon-box .elementor-icon {
    margin: 0 auto 12px auto !important;
  }
  .elementor-widget-icon-box .elementor-icon-box-content {
    text-align: center !important;
  }
  .elementor-section .elementor-container,
  .elementor-column .elementor-widget-wrap {
    text-align: center !important;
  }
  .elementor-heading-title,
  .elementor-widget-text-editor {
    text-align: center !important;
  }
}
/* FAQ accordion (native <details>/<summary>, no JS dependency) */
.tagani-faq-intro h2 { color:#0B1F3A; font-weight:800; }
.tagani-faq-intro p { color:#475569; }
.tagani-faq-list { max-width:800px; margin:24px 0; }
.tagani-faq-item {
  background:#FFFFFF;
  border:1px solid #E2E8F0;
  border-radius:10px;
  margin-bottom:12px;
  padding:0;
  overflow:hidden;
}
.tagani-faq-item summary {
  cursor:pointer;
  list-style:none;
  padding:18px 20px;
  font-weight:600;
  color:#0B1F3A;
  font-size:16px;
  position:relative;
  padding-right:44px;
}
.tagani-faq-item summary::-webkit-details-marker { display:none; }
.tagani-faq-item summary::after {
  content:'+';
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  color:#38BDF8;
  font-size:22px;
  font-weight:700;
}
.tagani-faq-item[open] summary::after { content:'\2212'; }
.tagani-faq-item[open] summary { border-bottom:1px solid #E2E8F0; }
.tagani-faq-answer { padding:16px 20px 20px; color:#334155; line-height:1.6; }
.tagani-faq-answer a { color:#38BDF8; }
/* header-style-6 (transparent-header design) hardcodes white text meant for
   a coral background. We use a solid white header instead, so force all of
   its text/icons to Deep Navy / Sky Blue for real readability. */
.header-style-6 .main-header .main-navigation-area .main-navigation ul.menu > li > a:hover,
.header-style-6 .main-header .main-navigation-area .main-navigation ul.menu > li > a,
.header-style-6 .main-header .main-navigation-area .main-navigation ul.menu > li.menu-item-has-children:after {
  color: #0B1F3A !important;
}
.header-style-6 .main-header .main-navigation-area .main-navigation ul.menu > li > a:hover {
  color: #38BDF8 !important;
}
.header-style-6 a.header-login-icon,
.header-style-6 a.header-chat-icon {
  color: #0B1F3A !important;
}
.header-style-6 .main-header,
.header-style-6 .site-header {
  background-color: #FFFFFF !important;
  box-shadow: 0 1px 3px rgba(11,31,58,0.08) !important;
}
/* Force the correct (dark) logo variant regardless of header style,
   matching our solid white header. */
.site-branding a.dark-logo { display: block !important; }
.site-branding a.light-logo { display: none !important; }
/* About Us page: photo banner purely decorative (no text on it), all real
   content sits below on a plain white background -- guaranteed readable. */
.tagani-about-banner {
  width: 100%;
  max-height: 360px;
  overflow: hidden;
  border-radius: 0 0 16px 16px;
  margin-bottom: 32px;
}
.tagani-about-banner img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
}
.tagani-about-content {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 20px 40px;
  color: #334155;
  line-height: 1.7;
}
.tagani-about-content h1 { color: #0B1F3A; font-weight: 800; margin-bottom: 16px; }
.tagani-about-content h2 { color: #0B1F3A; font-weight: 700; margin-top: 32px; }
.tagani-about-content a { color: #38BDF8; }
@media (max-width: 767px) {
  .tagani-about-banner img { height: 220px; }
}
/* Fix: the sitewide "p { color: navy }" rule directly matches <p> tags and
   always beats inherited color from a parent, even a more specific one --
   that's just how CSS inheritance works. This left footer widget paragraphs
   (and any other <p> on a dark background) dark-on-dark. Explicit override. */
.footer-top-area p,
.footer-top-area .widget p,
.footer-bottom-area p,
.tagani-mid-cta p,
.header-style-6 .main-header p {
  color: inherit;
}
.footer-top-area p, .footer-top-area .widget p { color: #CBD5E1 !important; }
/* Real fix for icon centering: the actual widget class is
   .elementor-widget-icon (a standalone Icon widget), not
   .elementor-widget-icon-box as previously assumed -- that selector never
   matched anything. Icon has its own explicit text-align:start that beats
   inherited centering (same inheritance issue as the footer text bug), so
   it needs a direct override, not just a parent rule. */
.elementor-widget-icon,
.elementor-widget-icon .elementor-icon-wrapper,
.elementor-widget-icon .elementor-widget-container {
  text-align: center !important;
}
.elementor-widget-icon .elementor-icon-wrapper {
  justify-content: center !important;
  display: flex !important;
}
@media (max-width: 767px) {
  .elementor-widget-icon,
  .elementor-widget-icon .elementor-icon-wrapper,
  .elementor-widget-icon .elementor-widget-container,
  .elementor-column .elementor-widget-wrap,
  .elementor-heading-title,
  .elementor-widget-text-editor {
    text-align: center !important;
  }
}