/* =========================================================
   Tactica Mega Menu CSS (8 columns; no mobile submenu)
   - Desktop: body-portal, auto-centered GRID; background 100%
   - Mobile: ONLY the “Vörur” top-level item is visible
   ========================================================= */

:root {
  --tactica-mm-primary-cols: 8;     /* number of columns */
  --tactica-mm-col: 175px;          /* column width */
  --tactica-mm-gap: 6px;           /* gap between columns */
  --tactica-mm-pad-x: 6px;         /* inner horizontal padding */
  --tactica-mm-pad-y: 24px;         /* inner vertical padding */

  /* auto compute the ideal inner max width from cols + gaps + padding */
  --tactica-mm-max: calc(
    (var(--tactica-mm-primary-cols) * var(--tactica-mm-col)) +
    ((var(--tactica-mm-primary-cols) - 1) * var(--tactica-mm-gap)) +
    (2 * var(--tactica-mm-pad-x))
  );
}

/* ===== Full-width background panel ===== */
.tactica-mm-portal {
  position: fixed;
  top: var(--tactica-mm-fixed-top, 100px);
  left: 0;
  right: 0;
  width: 100vw;
  max-width: 100vw;
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.06);
  box-shadow: none;
  z-index: 9999;
  box-sizing: border-box;
  color: var(--mm-link-color, #2d2d2d) !important;

  /* ensure no legacy transforms interfere */
  transform: none !important;
}

.tactica-mm-portal a {
  color: var(--mm-link-color, #2d2d2d) !important;
  text-decoration: none;
}

/* ===== Centered grid content ===== */
.tactica-mm-portal > ul.sub-menu.tactica-mm-fw {
  /* center purely with margin auto; no translate hacks */
  inline-size: min(100%, var(--tactica-mm-max));
  margin-inline: auto;
  padding: var(--tactica-mm-pad-y) var(--tactica-mm-pad-x);

  display: grid;
  grid-template-columns: repeat(var(--tactica-mm-primary-cols), var(--tactica-mm-col));
  column-gap: var(--tactica-mm-gap);
  row-gap: 0;

  /* this keeps the grid block itself centered if it’s narrower than container */
  justify-content: center;

  list-style: none;
  box-sizing: border-box;
}

/* neutralize theme floats */
.tactica-mm-portal > ul.sub-menu.tactica-mm-fw > li {
  width: auto !important;
  float: none !important;
}

/* ===== Headings + subitems ===== */
.tactica-mm-portal li.mega-column > a {
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: space-between;
  line-height: 1.3;
  color: inherit;
}

.tactica-mm-portal li.mega-column > ul.sub-menu {
  list-style: none;
  margin: 8px 0 0 0;
  padding: 0;
}

.tactica-mm-portal li .mega-subitem > a {
  display: block;
  line-height: 1.4;
  padding: 4px 0;
  font-weight: 400;
  color: inherit;
}

/* stacked-category group styling (if used) */
.same-column-category > a { font-weight: bold !important; }
.same-column-category { margin-top: 2rem; }

/* nudge */
li.mega-column {
    margin-left: 8rem !important;
}

/* ===== Mobile: show only “Vörur” parent ===== */
@media (max-width: 1024px) {
  .et_mobile_menu li.mega-menu > ul,
  .et_mobile_menu li.mega-menu > .sub-menu,
  .et_mobile_menu .mega-menu .sub-menu,
  #mobile_menu li.mega-menu > ul,
  #mobile_menu .mega-menu .sub-menu {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* ===== Safety fallback (theme UL width) ===== */
.et_pb_menu .et-menu li.mega-menu > ul,
.et-menu li.mega-menu > ul.sub-menu {
  min-width: 100% !important;
}
