/* Hide search box in mobile menu */
.mobile-menu-search,
.region-primary-menu .search-block-form,
.search-block-form {
  display: none !important;
}

/* Move dev mode/environment indicator banner to top of page */
.ccsoccer-dev-banner,
div[class*="dev-banner"] {
  position: relative;
}

/* Ensure dev banner is on top */
.ccsoccer-dev-banner {
  z-index: var(--z-dev-banner) !important;
}

/* Make sure toolbar comes after dev banner */
#toolbar-administration {
  z-index: 9999 !important;
}

/* CC Soccer toolbar icon (soccer ball SVG) */
.toolbar-icon-ccsoccer-admin::before,
.toolbar-icon-ccsoccer-admin:active::before,
.toolbar-icon-ccsoccer-admin.is-active::before {
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.toolbar-icon-ccsoccer-admin::before {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23777%22%20d%3D%22M255.03%2033.813c-1.834-.007-3.664-.007-5.5.03-6.73.14-13.462.605-20.155%201.344.333.166.544.32.47.438L204.78%2075.063l73.907%2049.437-.125.188%2070.625.28L371%2079.282%20342.844%2052c-15.866-6.796-32.493-11.776-49.47-14.78-12.65-2.24-25.497-3.36-38.343-3.407zM190.907%2088.25l-73.656%2036.78-13.813%2098.407%2051.344%2033.657%2094.345-43.438%2014.875-76.5-73.094-48.906zm196.344.344l-21.25%2044.5%2036.75%2072.72%2062.063%2038.905%2011.312-21.282c.225.143.45.403.656.75-.77-4.954-1.71-9.893-2.81-14.782-6.446-28.59-18.59-55.962-35.5-79.97-9.07-12.872-19.526-24.778-31.095-35.5l-20.125-5.342zm-302.656%2023c-6.906%208.045-13.257%2016.56-18.938%2025.5-15.676%2024.664-26.44%2052.494-31.437%2081.312C31.783%20232.446%2030.714%20246.73%2031%20261l20.25%205.094%2033.03-40.5L98.75%20122.53l-14.156-10.936zm312.719%20112.844l-55.813%2044.75-3.47%20101.093%2039.626%2021.126%2077.188-49.594%204.406-78.75-.094.157-61.844-38.783zm-140.844%206.406l-94.033%2043.312-1.218%2076.625%2089.155%2057.376%2068.938-36.437%203.437-101.75-66.28-39.126zm-224.22%2049.75c.91%208.436%202.29%2016.816%204.156%2025.094%206.445%2028.59%2018.62%2055.96%2035.532%2079.968%203.873%205.5%208.02%2010.805%2012.374%2015.938l-9.374-48.156.124-.032-27.03-68.844-15.782-3.968zm117.188%2084.844l-51.532%208.156%2010.125%2052.094c8.577%207.49%2017.707%2014.332%2027.314%2020.437%2014.612%209.287%2030.332%2016.88%2046.687%2022.594l62.626-13.69-4.344-31.124-90.875-58.47zm302.437.5l-64.22%2041.25-42%2047.375%204.408%206.156c12.027-5.545%2023.57-12.144%2034.406-19.72%2023.97-16.76%2044.604-38.304%2060.28-62.97%202.51-3.947%204.87-7.99%207.125-12.092zm-122.78%2097.656l-79.94%209.625-25.968%205.655c26.993%204%2054.717%203.044%2081.313-2.813%209.412-2.072%2018.684-4.79%2027.75-8.062l-3.156-4.406z%22%2F%3E%3C%2Fsvg%3E");
}

.toolbar-icon-ccsoccer-admin:active::before,
.toolbar-icon-ccsoccer-admin.is-active::before {
  filter: brightness(0);
}

/* Log in/Log out at top level - make it bold and prominent */
.login-link > a,
.logout-link > a {
  font-weight: var(--font-weight-bold) !important;
  font-size: 1.1em !important;
}

/* Menu Section Headers */
.menu-section-header > a {
  font-size: 1.1em;
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  pointer-events: none;
  cursor: default;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-left: 3px solid var(--color-primary);
  padding-left: 12px;
}

/* Indented menu items under headers */
.menu-section-header .menu a {
  font-size: 0.9em;
  padding-left: 20px;
  transition: color var(--transition-fast),
              background-color var(--transition-fast);
}

.menu-section-header .menu a:hover {
  color: var(--color-primary);
}

/* Hide Drupal's default user menu items (we're adding our own) */
.menu--account,
#block-olivero-account-menu,
.block-user-login-block,
li.menu-item--user-login,
li.menu-item--user-logout,
li.menu-item--user {
  display: none !important;
}

/* Hide Drupal's default Home link at top level (we have our own in submenu) */
li.menu-item--front,
a[data-drupal-link-system-path="<front>"],
.primary-nav__menu-item--level-1:has(a[data-drupal-link-system-path="<front>"]) {
  display: none !important;
}

/* ============================================
   MOBILE MENU ENHANCEMENTS (Phase 2)
   ============================================ */

@media (max-width: 768px) {
  .menu-section-header {
    margin-right: 50px; /* Give space for close button */
  }

  .menu-section-header > a {
    padding-right: 60px; /* Ensure text doesn't overlap with + button */
  }

  /* Touch-friendly menu items on mobile */
  .primary-nav__menu-link--level-2,
  .menu-section-header .menu a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 10px 16px 10px 20px;
  }

  /* Better visual separation between menu sections */
  .menu-section-header {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--color-gray-200);
  }

  .menu-section-header:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
  }
}

/* ============================================
   JERSEY PURCHASE PAGE
   ============================================ */

.jersey-purchase-header {
  margin-bottom: 30px;
  padding: 20px;
  background: var(--color-gray-100);
  border-left: 4px solid var(--color-accent);
  border-radius: 0 var(--radius-xl) var(--radius-xl) 0;
}

.jersey-purchase-header h1 {
  margin: 0 0 10px 0;
  color: var(--color-text);
}

.jersey-purchase-header p {
  margin: 0;
  color: var(--color-text-muted);
}

.jersey-variations-table {
  width: 100%;
  margin: 20px 0;
}

.jersey-variations-table th {
  background: var(--color-gray-800);
  color: var(--color-white);
  padding: 12px;
  text-align: left;
}

.jersey-variations-table td {
  padding: 12px;
  border-bottom: 1px solid var(--color-gray-200);
}

.jersey-variations-table tr:hover {
  background: var(--color-gray-100);
}

.jersey-variations-table .form-submit {
  background: var(--color-accent);
  color: var(--color-white);
  border: none;
  padding: 8px 20px;
  border-radius: var(--radius-md);
  cursor: pointer;
  font-weight: var(--font-weight-bold);
}

.jersey-variations-table .form-submit:hover {
  background: var(--color-accent-dark);
}