/* =========================
   SIDRI ADDITIONAL CSS — .IN
   V42 C100 | sidriinternational.in
   WP Admin -> Appearance -> Additional CSS
   ========================= */

/* 1. BREADCRUMBS  (Elementor class: sidri-breadcrumbs) */
.sidri-breadcrumbs,
.sidri-breadcrumbs * { font-size:14px !important; }
.sidri-breadcrumbs a { color:#112d60 !important;  /* differs from .COM (#1c3575) - confirm this is intentional brand colour, not drift */ text-decoration:none; }
.sidri-breadcrumbs a:hover,
.sidri-breadcrumbs a:focus { text-decoration:underline; }

/* 2. TOP BYLINE ROW  (Elementor class: sidri-byline) */
.sidri-byline {
  display:flex;
  align-items:center;
  flex-wrap:wrap;            /* safety: prevents overflow on narrow phones */
  gap:16px;
  padding:18px;
}

/* 3. BOTTOM BIO ROW  (Elementor class: sidri-bio) */
.sidri-bio {
  display:flex;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:18px;
}

/* 4. PERFECT CIRCLE AVATARS
   Class goes on the IMAGE WIDGET itself, not the section/column.
   Top:    sidri-byline__avatar (80x80)
   Bottom: sidri-bio__avatar    (150x150) */
.elementor-widget-image.sidri-byline__avatar,
.sidri-byline__avatar {
  width:80px !important; height:80px !important;
  min-width:80px !important; min-height:80px !important;
  flex:0 0 80px !important;
  border-radius:50% !important; overflow:hidden !important; display:block !important;
}
.elementor-widget-image.sidri-bio__avatar,
.sidri-bio__avatar {
  width:150px !important; height:150px !important;
  min-width:150px !important; min-height:150px !important;
  flex:0 0 150px !important;
  border-radius:50% !important; overflow:hidden !important; display:block !important;
}
.sidri-byline__avatar .elementor-widget-container,
.sidri-byline__avatar figure,
.sidri-bio__avatar .elementor-widget-container,
.sidri-bio__avatar figure {
  width:100% !important; height:100% !important;
  margin:0 !important; padding:0 !important;
  border-radius:50% !important; overflow:hidden !important; line-height:0 !important;
}
.sidri-byline__avatar img,
.sidri-bio__avatar img {
  width:100% !important; height:100% !important;
  max-width:none !important; display:block !important;
  object-fit:cover !important; object-position:center !important;
  border-radius:50% !important;
}

/* Mobile avatar sizes */
@media (max-width:767px){
  .sidri-byline { align-items:flex-start; gap:12px; }
  .elementor-widget-image.sidri-byline__avatar,
  .sidri-byline__avatar {
    width:64px !important; height:64px !important;
    min-width:64px !important; min-height:64px !important;
    flex:0 0 64px !important;
  }
  .sidri-bio { gap:14px; }
  .elementor-widget-image.sidri-bio__avatar,
  .sidri-bio__avatar {
    width:96px !important; height:96px !important;
    min-width:96px !important; min-height:96px !important;
    flex:0 0 96px !important;
  }
}

/* 5. FINAL CTA  (section: sidri-final-cta | button: sidri-final-cta__btn) */
.sidri-final-cta { padding:40px; border-radius:12px; text-align:center; margin:60px 0; }
@media (max-width:767px){
  .sidri-final-cta { padding:24px 16px; margin:40px 0; }   /* sides breathe */
}
.sidri-final-cta__btn .elementor-button {
  padding:14px 22px; border-radius:10px; font-weight:700;
  min-height:48px; display:inline-flex;
  align-items:center; justify-content:center; gap:10px;
}
.sidri-final-cta__btn .elementor-button:focus-visible {
  outline:2px solid currentColor; outline-offset:3px;
}

/* 6. TWO-COLUMN TABLES  (Elementor class: sidri-two-col-table) */
.sidri-two-col-table table {
  width:100% !important; max-width:100% !important;
  table-layout:fixed !important; border-collapse:collapse;
}
.sidri-two-col-table table,
.sidri-two-col-table thead,
.sidri-two-col-table tbody,
.sidri-two-col-table tr,
.sidri-two-col-table th,
.sidri-two-col-table td { box-sizing:border-box; }

/* Kill Word-paste fixed widths */
.sidri-two-col-table table[style],
.sidri-two-col-table th[style],
.sidri-two-col-table td[style],
.sidri-two-col-table col[style] { width:auto !important; max-width:100% !important; }

/* Wrap long text instead of pushing width */
.sidri-two-col-table th,
.sidri-two-col-table td {
  white-space:normal !important;
  overflow-wrap:anywhere; word-break:break-word; hyphens:auto;
}

/* Mobile: stack rows  (THIS BLOCK WAS BROKEN BY A BAD COMMENT IN THE OLD CSS) */
@media (max-width:767px){
  .sidri-two-col-table thead { display:none; }
  .sidri-two-col-table tr { display:block; width:100%; }
  .sidri-two-col-table td,
  .sidri-two-col-table th { display:block; width:100% !important; }
  .sidri-two-col-table td:first-child,
  .sidri-two-col-table th:first-child { font-weight:700; }   /* first cell = label */
}

/* 7. TLDR ANSWER BOX  (Elementor class: tldr-box) -- V42 speakable target
   Placed immediately after H1, before Introduction. */
.tldr-box { margin-top:0; margin-bottom:24px; display:block; width:100%; }
@media (max-width:767px){ .tldr-box { margin-bottom:16px; } }

/* 8. H2-1 AIO OPENING  (Elementor class: h2-1-opening) -- V42 speakable target
   First paragraph inside H2-1 only. */
.h2-1-opening { display:block; width:100%; }
