/* ================================
   Created by : Muhammad Shayan Ahmed
   Upadted on: 22-10-2025
   ================================ */


/* Color / spacing tokens */
:root{
  --fmr-bg: #ffffff;
  --page-bg: #f6f7fb;
  --primary: #2a3c8f;      /* main blue */
  --primary-600: #20305b;
  --accent: #ffc107;       /* yellow accent */
  --muted: #6b7280;
  --card-border: #e6e9ef;
  --radius: 10px;
  --max-width: 1100px;
  --transition-fast: 200ms;
  --transition-med: 320ms;
}

/* Page + wrapper */
body { background: var(--page-bg); font-family: "Roboto", "Helvetica Neue", Arial, sans-serif; color: #12202b; margin: 0; }
.fmr-wrapper { max-width: var(--max-width); margin: 28px auto; padding: 22px; background: var(--fmr-bg); border-radius: 12px; box-shadow: 0 6px 18px rgba(17,24,39,0.06); }

/* Row layout (scoped) */
.fmr-row { display: flex; gap: 18px; align-items: flex-start; }
.col-sm-3 { flex: 0 0 260px; max-width: 260px; }
.col-sm-9 { flex: 1 1 auto; min-width: 0; }

/* Sidebar */
.fmr-sidebar { padding-right: 10px; border-right: 1px solid var(--card-border); }
.fmr-title { font-size: 20px; font-weight: 700; margin-bottom: 12px; color: var(--primary-600); text-align: center; }

/* Accordion menu */
.fmr-menu { list-style: none; margin: 0; padding: 0; }
.fmr-year { margin-bottom: 12px; }
.year-toggle {
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  background: linear-gradient(180deg,var(--primary),var(--primary-600));
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  padding: 10px 14px;
  border-radius: var(--radius);
  border: 0;
  cursor: pointer;
  transition: background var(--transition-fast), transform var(--transition-fast);
  box-shadow: 0 2px 6px rgba(42,60,143,0.12);
}
.year-toggle:focus { outline: 3px solid rgba(42,60,143,0.18); outline-offset: 2px; }
.year-toggle:hover { transform: translateY(-1px); }

/* Expand/collapse using max-height for smoothness */
.fmr-submenu {
  list-style: none;
  margin: 8px 0 0 0;
  padding-left: 6px;
  overflow: hidden;
  max-height: 0;
  transition: max-height var(--transition-med) ease, opacity var(--transition-fast);
  opacity: 0;
}

/* when parent has .active the submenu expands */
.fmr-year.active .fmr-submenu {
  max-height: 1000px; /* large enough for many items */
  opacity: 1;
}

/* month item */
.fmr-submenu li { margin: 6px 0; }
.fmr-submenu a {
  display: block;
  text-decoration: none;
  color: var(--muted);
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 14px;
  transition: background var(--transition-fast), color var(--transition-fast), padding-left var(--transition-fast);
  position: relative;
}
.fmr-submenu a:hover,
.fmr-submenu a:focus { background: rgba(255,193,7,0.95); color: #111; transform: translateX(2px); outline: none; }
.fmr-submenu a:focus { box-shadow: 0 0 0 3px rgba(42,60,143,0.12); }

.fmr-submenu li a::before{
  content: "►";
  display:inline-block;
  width:16px;
  margin-right:6px;
  color: var(--primary-600);
  transform: scale(.95);
}

/* Active month (selected) */
.month-link.active-month,
.fmr-submenu a.active-month {
  background: var(--primary);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(42,60,143,0.12);
}

/* Right content */
.fmr-content { padding-left: 18px; display: flex; flex-direction: column; gap: 12px; min-height: 60px; overflow-y: auto; }
.fmr-content hr { border: none; border-top: 1px solid var(--card-border); margin: 10px 0; }
.fmr-heading { font-size: 22px; font-weight: 800; color: var(--primary-600); margin: 0; }
.fmr-desc { color: var(--muted); font-size: 14px; margin-bottom: 6px; }

/* docs area */
.fmr-docs { background: #fbfdff; border: 1px solid var(--card-border); border-radius: 12px; padding: 14px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.6); min-height: 140px; }

/* report card */
.report-card {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid var(--card-border);
  background: linear-gradient(180deg,#fff,#fbfdff);
  box-shadow: 0 6px 14px rgba(15,23,42,0.04);
}
.report-card + .report-card { margin-top: 10px; }

.report-title { margin: 0; font-weight: 700; color: var(--primary-600); font-size: 15px; word-break: break-word; }

/* download button as anchor or button */
.download-btn,
.download-link {
  appearance: none;
  -webkit-appearance: none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--primary);
  color: #fff;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
  transition: transform var(--transition-fast), background var(--transition-fast);
}
.download-btn:hover,
.download-link:hover { transform: translateY(-2px); background: var(--primary-600); color: #fff; }
.download-btn:focus,
.download-link:focus { outline: 3px solid rgba(42,60,143,0.14); outline-offset: 2px; }

/* when no reports selected */
.notice { color: var(--muted); font-style: italic; padding: 12px; }

/* Responsive */
@media (max-width: 767px) {
  .col-sm-3 { flex: 0 0 180px; max-width: 180px; }
  .fmr-sidebar { border-right: 1px solid var(--card-border); padding-right: 8px; margin-bottom: 0; }
  .fmr-submenu { padding-left: 4px; }
  .year-toggle { justify-content: space-between; font-size: 14px; padding: 8px 12px; }
  .fmr-submenu a { font-size: 13px; padding: 6px 8px; }
  .fmr-content { padding-left: 12px; }
  .fmr-heading { font-size: 18px; }
  .report-card { flex-direction: column; align-items:flex-start; }
  .report-title { font-size: 14px; }
  .download-btn,
  .download-link { width: 100%; justify-content:center; margin-top:8px; font-size: 13px; padding: 6px 10px; }
}

/* Small polish: reduce submenu jump when opening by smoothing font-opacity */
.fmr-submenu a { opacity: .98; }

/* End updated FMR styles */