/* OpenCart-specific additions for the bbmarkt theme (common-layout lane) */

/* header stays opaque while sticky */
.mk-header { background: #fff; }
.mk-body > main.mk-main { background: #fff; }

/* main navigation: pill links with an animated hover/active state */
.mk-nav {
  background: linear-gradient(#fff, #f7f9fd);
  border-bottom: 1px solid var(--td-border);
  box-shadow: inset 0 -3px 0 -2px rgba(22, 44, 100, .06);
}
.mk-nav-list { gap: 2px 4px; padding: 9px 0; }
.mk-nav-item { position: relative; }
.mk-nav-link {
  position: relative; padding: 8px 15px; font-weight: 600; letter-spacing: .01em;
  border-radius: 999px; transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.mk-nav-link > span { position: relative; }
.mk-nav-link > span::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -3px; height: 2px;
  background: var(--td-yellow); border-radius: 2px;
  transform: scaleX(0); transform-origin: center; transition: transform .2s ease;
}
.mk-nav-item:hover > .mk-nav-link,
.mk-nav-link:focus-visible {
  background: rgba(22, 44, 100, .07); color: var(--td-navy-deep); text-decoration: none;
  box-shadow: 0 2px 8px rgba(18, 37, 84, .10);
}
.mk-nav-item:hover > .mk-nav-link > span::after { transform: scaleX(1); }
.mk-nav-link-drop::after { transition: transform .2s ease; }
.mk-nav-item:hover > .mk-nav-link-drop::after { transform: rotate(-180deg); }
.mk-nav-link-active { background: var(--td-navy); color: #fff; }

/* hover submenu in the main navigation */
.mk-nav-sub {
  position: absolute; left: 50%; top: calc(100% + 6px); min-width: 250px; background: #fff;
  border: 1px solid var(--td-border); border-top: 3px solid var(--td-yellow); border-radius: 0 0 12px 12px;
  box-shadow: 0 18px 38px rgba(18, 37, 84, .16); padding: 10px 6px; z-index: 70;
  opacity: 0; visibility: hidden; transform: translate(-50%, -6px);
  transition: opacity .16s ease .12s, transform .16s ease .12s, visibility 0s linear .28s;
}
.mk-nav-sub::before {
  content: ''; position: absolute; left: 0; right: 0; top: -9px; height: 9px;
}
.mk-nav-item:last-child > .mk-nav-sub { left: auto; right: 0; transform: translate(0, -6px); }
.mk-nav-item:hover > .mk-nav-sub,
.mk-nav-sub:hover { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
.mk-nav-item:last-child:hover > .mk-nav-sub { transform: translate(0, 0); }
.mk-nav-sub-wide { min-width: 470px; }
.mk-nav-sub-wide .mk-nav-sub-list { columns: 2; column-gap: 8px; }
.mk-nav-sub-list { list-style: none; margin: 0; padding: 0; }
.mk-nav-sub-list li { break-inside: avoid; }
.mk-nav-sub-list a {
  display: block; padding: 7px 14px; font-size: 13.5px; font-weight: 600; color: var(--td-navy);
  border-radius: 8px; transition: background-color .15s ease, color .15s ease, padding-left .15s ease;
}
.mk-nav-sub-list a:hover { background: var(--td-surface); color: #000; padding-left: 20px; }

/* header badges: attached to the icon corner, hidden when empty */
.mk-count[hidden] { display: none !important; }
.mk-action { position: relative; }

/* toast container also serves as the OpenCart #alert target */
#alert.mk-toast-wrap { padding: 0; }
#alert .alert { display: none; }

/* generic form/control polish (no focus rings, soft radius, light checkboxes) */
.mk-body input, .mk-body select, .mk-body textarea, .mk-body .btn { border-radius: 4px; }
.mk-body input[type="checkbox"], .mk-body input[type="radio"] {
  appearance: auto; -webkit-appearance: auto; background: #fff; accent-color: var(--td-navy);
  width: 16px; height: 16px; border-radius: 3px;
}
.mk-body a:hover { text-decoration: none; }

/* stock OpenCart leftovers that must not show up in the shared layout */
.mk-body .breadcrumb { background: transparent; padding: 0; margin: 0; }
.mk-body #alert .toast { display: none; }

/* drawer must cover the sticky header */
.mk-catalog-drawer { z-index: 120; }
.mk-catalog-side { z-index: 121; }

/* no white gap above the header / below the footer */
html, body { margin: 0; }
html { background: #fff; }
.mk-footer { margin-bottom: 0; }
.mk-body { padding-bottom: 0; }

/* header buttons must not stay "pressed" after a click */
.mk-burger:focus, .mk-burger:active, .mk-action:focus, .mk-action:active,
.mk-search-btn:focus, .mk-search-btn:active { outline: none; box-shadow: none; }
.mk-burger:focus:not(:hover) { background: transparent; }
.mk-action:focus:not(:hover) { background: transparent; }