/*
Theme Name: Rotary Theme
Theme URI: https://rotarytrinco.org/
Author: Rotary Club of Trincomalee
Author URI: https://rotarytrinco.org/
Description: A stable, responsive, Rotary Club of Trincomalee presentation theme. Presentation only: header, footer, navigation, page templates and visual customisation. Requires Rotary Core plugin for legacy content types and shortcodes. No automatic homepage additions or image re-encoding.
Version: 1.14.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: rotary
Tags: custom-menu, custom-colors, custom-logo, featured-images, full-width-template, sticky-header, translation-ready

Rotary WordPress Theme is released under GPL-2.0-or-later.
*/

/* ==========================================================================
   1. CSS Variables (Rotary default palette + fonts — all overridable
      live via Customizer, see inc/customizer.php + assets/css output)
   ========================================================================== */
:root{
  --rotary-primary:#17458f;      /* Rotary blue */
  --rotary-secondary:#103b67;    /* Rotary navy */
  --rotary-accent:#f7b900;
  --rotary-text:#222222;
  --rotary-text-light:#5f6368;
  --rotary-bg:#ffffff;
  --rotary-bg-alt:#f7f8fa;
  --rotary-border:#e7e8ec;
  --rotary-header-bg:#ffffff;
  --rotary-header-text:#1a1a1a;
  --rotary-footer-bg:#103b67;
  --rotary-footer-text:#e9edf5;
  --rotary-font-heading:'Open Sans', sans-serif;
  --rotary-font-body:'Open Sans', sans-serif;
  --rotary-container:1280px;
  --rotary-radius:8px;
  --rotary-header-height:78px;
}

/* ==========================================================================
   2. Reset / Base
   ========================================================================== */
*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--rotary-font-body);
  color:var(--rotary-text);
  background:var(--rotary-bg);
  line-height:1.65;
  font-size:16px;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--rotary-font-heading);
  color:var(--rotary-text);
  line-height:1.25;
  margin:0 0 .6em;
}
a{ color:var(--rotary-primary); text-decoration:none; }
a:hover{ text-decoration:underline; }
img{ max-width:100%; height:auto; display:block; }
ul{ margin:0; padding:0; }
.rotary-container{
  max-width:var(--rotary-container);
  margin:0 auto;
  padding:0 20px;
}
.screen-reader-text{
  position:absolute !important;
  width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap;
}

/* ==========================================================================
   3. Site Header / Sticky
   ========================================================================== */
.rotary-header{
  background:var(--rotary-header-bg);
  color:var(--rotary-header-text);
  border-bottom:1px solid var(--rotary-border);
  position:relative;
  z-index:999;
}
.rotary-header.is-sticky-enabled{
  position:sticky;
  top:0;
}
.rotary-header.is-scrolled{
  box-shadow:0 4px 18px rgba(0,0,0,.08);
}
.rotary-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:var(--rotary-header-height);
  gap:24px;
}
.rotary-branding{ display:flex; align-items:center; gap:10px; }
.rotary-branding .custom-logo{ max-height:44px; width:auto; }
.rotary-site-title{ font-size:22px; font-weight:700; margin:0; }
.rotary-site-title a{ color:var(--rotary-header-text); }
.rotary-site-description{ font-size:12px; color:var(--rotary-text-light); margin:0; }

/* ==========================================================================
   4. Primary / Mega Menu
   ========================================================================== */
.rotary-primary-nav{ flex:1; display:flex; align-self:stretch; justify-content:flex-end; }
.rotary-menu{ display:flex; align-items:stretch; list-style:none; height:100%; }
.rotary-menu > li{ position:relative; display:flex; }
.rotary-menu > li > a{
  display:flex;
  align-items:center;
  height:100%;
  padding:0 16px;
  color:var(--rotary-header-text);
  font-weight:600;
  font-size:15px;
  box-sizing:border-box;
}
.rotary-menu > li > a:hover,
.rotary-menu > li.current-menu-item > a{
  color:var(--rotary-primary);
  text-decoration:none;
}
.rotary-menu li.menu-item-has-children > a::after{
  content:"";
  display:inline-block;
  width:6px;height:6px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  margin-left:6px;
}

/* Standard dropdown (non-mega) */
.rotary-menu .sub-menu{
  position:absolute;
  top:100%; left:0;
  min-width:220px;
  background:var(--rotary-bg);
  border:1px solid var(--rotary-border);
  border-radius:var(--rotary-radius);
  box-shadow:0 12px 28px rgba(0,0,0,.12);
  padding:8px 0;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease;
  z-index:1000;
  pointer-events:none;
}
/* Visibility is driven ONLY by the .rotary-open class (added by JS with a
   short hover-intent delay — see navigation.js). A plain :hover rule here
   would fire instantly and race against that delay, which is exactly what
   let a neighboring mega menu steal focus when the cursor briefly grazed
   it while moving into an open dropdown — so there is deliberately no
   :hover selector on this rule. */
.rotary-menu li.rotary-open > .sub-menu{
  opacity:1; visibility:visible; transform:translateY(0);
  pointer-events:auto;
}
/* Third-level and deeper dropdowns fly out beside their parent instead of
   appearing below it. JavaScript flips them left when the right edge is tight. */
.rotary-menu .sub-menu li{ position:relative; }
.rotary-menu .sub-menu .sub-menu{
  top:0;
  left:100%;
  right:auto;
  min-width:220px;
  transform:translateX(8px);
  z-index:100001;
}
.rotary-menu .sub-menu li.rotary-open > .sub-menu{
  opacity:1;
  visibility:visible;
  transform:translateX(0);
  pointer-events:auto;
}
.rotary-menu .sub-menu li.rotary-submenu-left > .sub-menu{
  left:auto;
  right:100%;
  transform:translateX(-8px);
}
.rotary-menu .sub-menu li.rotary-submenu-left.rotary-open > .sub-menu{
  transform:translateX(0);
}
.rotary-menu .sub-menu a{ padding:10px 18px; display:block; color:var(--rotary-text); font-weight:500; font-size:14px; }
.rotary-menu .sub-menu a:hover{ background:var(--rotary-bg-alt); color:var(--rotary-primary); }

/* Mega menu (Max-Mega-Menu style): any top-level item tagged with the
   "rotary-mega" CSS class (added via menu item's Description/Classes
   field in the WP menu editor) becomes a full-bleed panel that starts
   exactly at the left edge of the page and spans the full browser width
   — it anchors to .rotary-header (position:relative/sticky, full width),
   not the centered content container, so it can never be clipped or
   pushed off to one side regardless of column count. */
.rotary-menu > li.rotary-mega{ position:static; }
.rotary-menu > li.rotary-mega > .sub-menu{
  left:0;
  right:0;
  width:auto;
  margin:0;
  display:grid;
  grid-template-columns:repeat(var(--rotary-mega-cols, 4), 1fr);
  gap:24px;
  padding-top:28px;
  padding-bottom:28px;
  /* Side padding lines up the columns with the site's own container width
     on wide screens, while the panel's background still spans edge-to-edge. */
  padding-left:max(28px, calc((100vw - var(--rotary-container)) / 2 + 28px));
  padding-right:max(28px, calc((100vw - var(--rotary-container)) / 2 + 28px));
  box-sizing:border-box;
  max-height:calc(100vh - var(--rotary-header-height) - 24px);
  overflow-y:auto;
}
.rotary-menu > li.rotary-mega .sub-menu > li{ display:block; min-width:0; }
.rotary-menu > li.rotary-mega .sub-menu > li > a{
  font-weight:700;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.04em;
  color:var(--rotary-secondary);
  padding:0 0 8px;
}
.rotary-menu > li.rotary-mega .sub-menu .sub-menu{
  position:static; left:auto; right:auto; min-width:0; box-shadow:none; border:0; opacity:1; visibility:visible; transform:none; padding:0; pointer-events:auto;
}
.rotary-menu > li.rotary-mega .sub-menu .sub-menu a{ padding:6px 0; font-weight:400; }
.rotary-mega-col-media{ margin-top:12px; }
.rotary-mega-col-image{
  width:100%;
  height:auto;
  border-radius:var(--rotary-radius);
  display:block;
}

.rotary-mobile-toggle{ display:none; }
.rotary-entry-title{ font-size:var(--rotary-post-title-size, 32px); line-height:1.2; }
/* Adjustable body text size for single posts; defaults preserve the existing 16px appearance. */
.single-post .entry-content, .single-post .post-content{ font-size:var(--rotary-post-font-desktop, 16px); }
@media (min-width:601px) and (max-width:1024px){ .single-post .entry-content, .single-post .post-content{ font-size:var(--rotary-post-font-tablet, 16px); } }
@media (max-width:600px){ .single-post .entry-content, .single-post .post-content{ font-size:var(--rotary-post-font-mobile, 16px); } }
.rotary-menu .sub-menu{ z-index:99999; }
.rotary-menu > li.rotary-mega > .sub-menu{ z-index:100000; }

@media (max-width:900px){
  .rotary-mobile-toggle{
    display:inline-flex; align-items:center; justify-content:center;
    width:48px;height:48px; min-width:48px; flex:0 0 48px; border:2px solid var(--rotary-secondary); border-radius:8px;
    background:var(--rotary-secondary); color:#fff; cursor:pointer; position:relative; z-index:100002;
    margin-left:auto; box-shadow:0 2px 6px rgba(0,0,0,.16);
  }
  .rotary-primary-nav{
    position:fixed; inset:var(--rotary-header-height) 0 0 0; z-index:100001;
    background:var(--rotary-bg);
    transform:translateX(100%);
    transition:transform .25s ease;
    overflow-y:auto;
    display:block;
  }
  .rotary-primary-nav.is-open{ transform:translateX(0); }
  .rotary-menu{ flex-direction:column; align-items:stretch; padding:12px 20px; }
  .rotary-menu > li > a{ min-height:46px; padding:10px 14px; }
  .rotary-mobile-toggle span{ display:block; width:22px; height:2px; background:#fff; margin:3px 0; border-radius:2px; }
  .rotary-mobile-toggle:focus-visible{ outline:3px solid var(--rotary-accent); outline-offset:3px; }
  .rotary-entry-title{ font-size:clamp(24px, 5vw, var(--rotary-post-title-size, 32px)); }
  .rotary-menu .sub-menu,
  .rotary-menu > li.rotary-mega > .sub-menu{
    position:static; display:none; grid-template-columns:1fr;
    box-shadow:none; opacity:1; visibility:visible; transform:none;
    width:auto; max-width:none; padding:6px 0 6px 14px;
  }
  .rotary-menu li.rotary-open > .sub-menu{ display:grid; }
}

/* ==========================================================================
   5. Layout / Content
   ========================================================================== */
.rotary-main{ padding:48px 0; min-height:40vh; }
.rotary-full-width .rotary-main{ padding:0; }
.rotary-entry-title{ font-size:2rem; }
.rotary-card{
  border:1px solid var(--rotary-border);
  border-radius:var(--rotary-radius);
  padding:24px;
  background:var(--rotary-bg);
}
.button, .btn, input[type=submit]{
  display:inline-block;
  background:var(--rotary-primary);
  color:#fff;
  border:0;
  padding:12px 22px;
  border-radius:var(--rotary-radius);
  font-weight:600;
  cursor:pointer;
}
.button:hover, .btn:hover, input[type=submit]:hover{ opacity:.9; text-decoration:none; }

/* ==========================================================================
   6. Footer
   ========================================================================== */
.rotary-footer{
  background:var(--rotary-footer-bg);
  color:var(--rotary-footer-text);
  padding:56px 0 24px;
  margin-top:64px;
}
.rotary-footer a{ color:var(--rotary-footer-text); opacity:.85; }
.rotary-footer a:hover{ opacity:1; }
.rotary-footer-widgets{
  display:grid;
  grid-template-columns:repeat(var(--rotary-footer-cols,4), 1fr);
  gap:32px;
  padding-bottom:32px;
  border-bottom:1px solid rgba(255,255,255,.12);
  margin-bottom:24px;
}
.rotary-footer-widgets h2, .rotary-footer-widgets h3{ color:#fff; font-size:16px; }
.rotary-footer-about .rotary-footer-logo .custom-logo{ max-height:40px; margin-bottom:12px; filter:brightness(0) invert(1); }
.rotary-footer-about p{ font-size:14px; opacity:.85; margin:0 0 16px; }
.rotary-social-links{ display:flex; gap:10px; }
.rotary-social-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,.1);
  color:#fff; opacity:1;
  transition:background .15s ease;
}
.rotary-social-link:hover{ background:var(--rotary-primary); text-decoration:none; }
.rotary-footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  font-size:13px; opacity:.8;
}
@media (max-width:780px){
  .rotary-footer-widgets{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
  .rotary-footer-widgets{ grid-template-columns:1fr; }
}

/* Elementor compatibility: let Elementor's own width/box settings win
   on pages built with it, and remove theme padding on Elementor canvas */
.elementor-page .rotary-main{ padding:0; }


/* Accessible image lightbox with gallery navigation */
.rotary-lightbox-trigger{ cursor:zoom-in; }
.rotary-lightbox-click-surface{ cursor:zoom-in !important; }
.rotary-lightbox{ position:fixed; inset:0; z-index:200000; display:flex; align-items:center; justify-content:center; padding:clamp(12px, 3vw, 36px); background:rgba(0,0,0,.92); }
.rotary-lightbox[hidden], .rotary-lightbox [hidden]{ display:none !important; }
.rotary-lightbox > img{ display:block; max-width:92vw; max-height:84vh; width:auto; height:auto; object-fit:contain; margin:auto; box-shadow:0 8px 40px rgba(0,0,0,.35); }
.rotary-lightbox-close,.rotary-lightbox-nav{ position:absolute; z-index:2; display:flex; align-items:center; justify-content:center; min-width:46px; min-height:46px; border:1px solid rgba(255,255,255,.75); border-radius:50%; background:rgba(12,18,28,.88); color:#fff; cursor:pointer; line-height:1; }
.rotary-lightbox-close{ top:12px; right:16px; font-size:32px; }
.rotary-lightbox-nav{ top:50%; transform:translateY(-50%); font-size:26px; }
.rotary-lightbox-previous{ left:clamp(8px,2vw,28px); }
.rotary-lightbox-next{ right:clamp(8px,2vw,28px); }
.rotary-lightbox-counter{ position:absolute; bottom:12px; left:50%; transform:translateX(-50%); color:#fff; font-size:14px; background:rgba(0,0,0,.55); padding:6px 12px; border-radius:20px; }
.rotary-lightbox button:focus-visible{ outline:3px solid #ffd166; outline-offset:3px; }
.rotary-lightbox:focus{ outline:none; }
@media(max-width:600px){ .rotary-lightbox{ padding:58px 8px 44px; } .rotary-lightbox > img{ max-width:96vw; max-height:78vh; } .rotary-lightbox-nav{ min-width:42px; min-height:42px; font-size:22px; } .rotary-lightbox-previous{ left:5px; } .rotary-lightbox-next{ right:5px; } }
@media (prefers-reduced-motion: reduce){ .rotary-primary-nav,.rotary-menu .sub-menu{ transition:none !important; } }


/* Version 1.12.3: consistent Open Sans typography across the site.
   Deliberately does not alter menu layout, submenu positioning, or interaction. */
body,
body p, body span, body a, body li, body label, body input, body button,
body select, body textarea, body blockquote, body table, body th, body td,
body h1, body h2, body h3, body h4, body h5, body h6,
.rotary-header, .rotary-header a, .rotary-site-title, .rotary-site-description,
.rotary-primary-nav, .rotary-primary-nav a, .rotary-menu, .rotary-menu a,
.entry-content, .entry-content p, .entry-content li, .entry-content a,
.post-content, .post-content p, .post-content li, .post-content a,
article, article p, article li, article a, .widget, .widget-title,
.site-footer, .site-footer p, .site-footer a {
  font-family: 'Open Sans', sans-serif !important;
}


/* Version 1.12.7: responsive post-card grids for blog, archive and homepage. */
.rotary-post-listing-layout { min-width: 0; }
.rotary-post-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  align-items: stretch;
}
.rotary-post-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--rotary-border);
  border-radius: var(--rotary-radius);
  background: var(--rotary-bg);
  box-shadow: 0 3px 14px rgba(0, 0, 0, .045);
  transition: box-shadow .18s ease, transform .18s ease;
}
.rotary-post-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .10);
  transform: translateY(-2px);
}
.rotary-post-card-image {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--rotary-bg-alt);
}
.rotary-post-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}
.rotary-post-card-image:hover img { transform: scale(1.025); }
.rotary-post-card-image-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  color: var(--rotary-secondary);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}
.rotary-post-card-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 18px;
}
.rotary-post-card-date {
  margin: 0 0 8px;
  color: var(--rotary-text-light);
  font-size: 12px;
  line-height: 1.4;
}
.rotary-post-card-title {
  margin: 0 0 10px;
  font-size: clamp(17px, 1.35vw, 21px);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.rotary-post-card-title a { color: var(--rotary-secondary); }
.rotary-post-card-title a:hover { color: var(--rotary-primary); }
.rotary-post-card-excerpt {
  margin: 0 0 16px;
  color: var(--rotary-text-light);
  font-size: 14px;
  line-height: 1.65;
}
.rotary-post-card-read-more {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: auto;
  color: var(--rotary-primary);
  font-size: 14px;
  font-weight: 700;
}
.rotary-post-card-read-more:hover { text-decoration: underline; }
.rotary-post-listing-layout .rotary-primary-col { min-width: 0; }
.rotary-home-latest { margin: 48px auto 12px; }
.rotary-home-latest-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}
.rotary-home-latest-heading h2 {
  margin: 0;
  color: var(--rotary-secondary);
  font-size: clamp(24px, 3vw, 32px);
}
.rotary-home-latest-all { flex: 0 0 auto; font-weight: 700; }
@media (min-width: 1100px) {
  .rotary-home-latest .rotary-post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 601px) and (max-width: 1024px) {
  .rotary-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .rotary-post-card-content { padding: 16px; }
  .rotary-post-listing-layout { gap: 24px !important; }
}
@media (max-width: 600px) {
  .rotary-post-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .rotary-post-card-content { padding: 17px; }
  .rotary-post-card-title { font-size: 20px; }
  .rotary-post-listing-layout { display: block !important; }
  .rotary-post-listing-layout > .widget-area,
  .rotary-post-listing-layout > #secondary { margin-top: 28px; }
  .rotary-home-latest-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .rotary-post-card, .rotary-post-card-image img { transition: none; }
  .rotary-post-card:hover { transform: none; }
}

/* Version 1.12.12: automatic archive loading and separate event diary shortcode. */
.rotary-infinite-scroll-sentinel{height:2px;width:100%;}
.rotary-infinite-scroll-status{min-height:1em;text-align:center;color:var(--rotary-text-light);font-size:13px;}
.rotary-infinite-scroll-enabled .rotary-archive-pagination{display:none;}