/* lcghs.edu.bd — front-end polish, loaded last so every rule here is an override.
   Added 2026-09-18. Safe to delete: the theme falls back to its own styles. */

/* ── 1. counter card stopped covering the section below it ──────────────────
   style.css has .funfact{position:absolute} and lifts #counters up by 78px.
   That only works when the next section carries the theme's 200px top padding
   (.events.index-events). On this home page the next block is the opening-hour
   grid, so the card sat on top of its heading. Keep the lift, drop the absolute. */
.funfact {
  position: relative;
  width: 100%;
}
.funfact #counters {
  bottom: 0;
  margin-bottom: 0;
  margin-top: -78px;
}
@media only screen and (max-width: 1199px) {
  .funfact #counters { margin-top: -66px; }
}
@media only screen and (max-width: 991px) {
  .funfact #counters { margin-top: -54px; }
}
@media only screen and (max-width: 767px) {
  .funfact { padding: 0 15px; }
  .funfact #counters {
    position: relative;
    bottom: 0;
    margin-top: -36px;
    margin-bottom: 0;
    padding: 28px 0 6px;
    border-radius: 10px;
  }
}

/* ── 2. counter row stays centred with 3 items as well as 4 ─────────────── */
.funfact #counters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.funfact #counters > [class*="col-"] {
  flex: 1 1 160px;
  max-width: 280px;
}

/* ── 3. missing image files no longer leave an empty broken frame ──────────
   lcghs-polish.js tags <img> that fail to load; we paint a placeholder on the
   wrapper instead. Teacher photos and the three feature icons are 404 today. */
img.img-missing {
  opacity: 0 !important;
}
.img-missing-holder {
  background-repeat: no-repeat;
  background-position: center;
}
.teacher_wrapper_img.img-missing-holder {
  background-color: #eef2ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23b7c6ee'%3E%3Ccircle cx='12' cy='8' r='4.2'/%3E%3Cpath d='M3.6 21c0-4.6 3.8-8.2 8.4-8.2s8.4 3.6 8.4 8.2z'/%3E%3C/svg%3E");
  background-size: 96px;
}
.feature_item_icon.img-missing-holder {
  background-color: #e6edfd;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23125de9' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6.5L9.2 17.3 4 12.1'/%3E%3C/svg%3E");
  background-size: 34px;
  width: 70px;
  height: 60px;
  border-radius: 50%;
}

/* ── 4. teacher cards line up as one grid ───────────────────────────────── */
.teacher_wrapper_img {
  border-radius: 10px;
}
.teacher .col-lg-3 {
  margin-bottom: 10px;
}

/* ── 5. slider keeps one height, so the page below it stops jumping ─────── */
.hero_area_inner img {
  width: 100%;
  height: clamp(220px, 38vw, 520px);
  object-fit: cover;
  object-position: center;
}

/* ── 6. keyboard focus is visible (it was outline:none everywhere) ──────── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #125de9;
  outline-offset: 2px;
}

/* ── 7. phone-sized touch targets in the drawer menu ────────────────────── */
@media only screen and (max-width: 991px) {
  .heading_mobile_menu ul li a {
    padding-top: 11px;
    padding-bottom: 11px;
  }
}

/* ── 8. long Bengali notice titles wrap instead of pushing the row wide ─── */
.noticeboard_inner_content h4,
.noticeboard_inner_content p,
.notice_item h4 {
  overflow-wrap: anywhere;
}

/* ── 9. photo cut-outs on a white background no longer look like holes ──── */
.teacher_wrapper_img {
  background-color: #f4f6fc;
}

/* ── 10. footer crest was a dark logo on a blue panel ───────────────────── */
.footer-item-logo img {
  max-width: 96px;
  background: #ffffff;
  border-radius: 50%;
  padding: 8px;
}

/* ── 11. two teacher cards per row on phones/tablets instead of one ─────── */
@media only screen and (max-width: 991px) {
  .teacher .col-lg-3 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .teacher_wrapper_img {
    height: 250px;
    margin-bottom: 14px;
  }
}
@media only screen and (max-width: 575px) {
  .teacher_wrapper_img {
    height: 190px;
  }
  .teacher_wrapper_img.img-missing-holder {
    background-size: 64px;
  }
}

/* ── 12. nav fits on one row on laptop widths ───────────────────────────────
   The two hand-added links (Quick Pay, Fee Slip) used to carry inline
   padding:0; with the theme padding restored the row needs a little less
   horizontal air between 992px and 1439px. */
@media only screen and (min-width: 992px) and (max-width: 1439px) {
  .heading_main_menu_list_link {
    padding-left: 9px;
    padding-right: 9px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .heading_main_menu_list_link {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 13.5px;
  }
}