/* ============================================================
   КАПРИН — мобильное меню категорий: единое «стекло» (13.11.2026)
   Владелец: «сделай кнопки аккуратными в стиле стеклянные как и другие».
   Материал тот же, что glass.css v12 («чистое стекло»): без размытия,
   тонкая светлая грань по контуру, узкий диагональный блик, мягкая тень.
   Файл подключён последним (после mobile-dock.css) и действует только
   на мобильной версии (max-width: 900px).
   ============================================================ */

@media (max-width: 900px) {

  /* аккуратные отступы панели */
  .mob-sheet-panel { padding: 16px 16px calc(22px + env(safe-area-inset-bottom, 0px)); }
  .mob-sheet-head { margin-bottom: 12px; }

  /* общий стеклянный материал для кнопок меню */
  .mob-sheet-all,
  .mob-sheet-quick a,
  .mob-sheet-subs a {
    position: relative;
    isolation: isolate;
    border: 1px solid;
    background-clip: padding-box;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    -webkit-tap-highlight-color: transparent;
    transition: background-color .2s ease, border-color .2s ease,
                box-shadow .2s ease, transform .18s ease, filter .2s ease;
  }
  .mob-sheet-all::before,
  .mob-sheet-quick a::before,
  .mob-sheet-subs a::before {
    content: "";
    position: absolute; inset: 0; z-index: -1;
    border-radius: inherit; pointer-events: none;
    background:
      linear-gradient(104deg,
        rgba(255,255,255,0) 26%, rgba(255,255,255,.46) 33%,
        rgba(255,255,255,.10) 39%, rgba(255,255,255,0) 47%),
      linear-gradient(180deg, rgba(255,255,255,.30) 0%, rgba(255,255,255,.05) 30%, rgba(255,255,255,0) 46%);
  }

  /* «Весь каталог» — чёрное стекло (как «В корзину»), главная кнопка */
  .mob-sheet-all {
    display: flex; align-items: center; justify-content: center;
    min-height: 48px; padding: 12px 16px; margin-bottom: 14px;
    border-radius: 14px;
    background-color: rgba(12,12,16,.60);
    background-image: linear-gradient(160deg, rgba(58,58,66,.26), rgba(8,8,11,.34) 64%);
    color: #fff; border-color: rgba(255,255,255,.30);
    text-shadow: 0 1px 2px rgba(0,0,0,.45);
    font-size: 15px; font-weight: 700; letter-spacing: .01em;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.40),
      inset 0 -1px 0 rgba(0,0,0,.30),
      0 8px 20px rgba(8,12,18,.28);
  }

  /* быстрые действия — светлое прозрачное стекло, ровная сетка 2 колонки */
  .mob-sheet-quick {
    display: grid; grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px; margin: 0 0 16px;
  }
  .mob-sheet-quick a {
    display: flex; align-items: center; justify-content: center; text-align: center;
    min-height: 46px; padding: 10px 12px; border-radius: 14px;
    background-color: rgba(255,255,255,.10);
    background-image: linear-gradient(180deg, rgba(255,255,255,.48) 0%, rgba(255,255,255,.08) 46%, rgba(15,23,42,.05) 100%);
    color: var(--navy, #0b1220); border-color: rgba(15,23,42,.20);
    font-size: 13.5px; font-weight: 700; line-height: 1.25;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.95),
      inset 0 -1px 0 rgba(15,23,42,.08),
      0 2px 5px rgba(15,23,42,.06),
      0 10px 22px rgba(15,23,42,.07);
  }
  /* пятый пункт («Собери щит») — на всю ширину, без одинокой половины */
  .mob-sheet-quick a:last-child:nth-child(odd) { grid-column: 1 / -1; }

  /* подкатегории — светлые стеклянные пилюли, единый размер и отступы */
  .mob-sheet-subs { gap: 8px; }
  .mob-sheet-subs a {
    display: inline-flex; align-items: center;
    min-height: 40px; padding: 8px 14px; border-radius: 999px;
    background-color: rgba(255,255,255,.10);
    background-image: linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.10) 46%, rgba(15,23,42,.03) 100%);
    color: #334155; border-color: rgba(23,23,23,.22);
    font-size: 13.5px; font-weight: 600; line-height: 1.2;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.98),
      inset 0 -1px 0 rgba(15,23,42,.07),
      0 2px 5px rgba(15,23,42,.05),
      0 8px 18px rgba(15,23,42,.06);
  }
  /* у мелких пилюль блик короче, чтобы не было разводов */
  .mob-sheet-subs a::before {
    background:
      linear-gradient(104deg,
        rgba(255,255,255,0) 30%, rgba(255,255,255,.30) 36%,
        rgba(255,255,255,.06) 41%, rgba(255,255,255,0) 48%),
      linear-gradient(180deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,.04) 34%, rgba(255,255,255,0) 50%);
  }

  /* заголовки категорий — ровные интервалы, мягкий разделитель */
  .mob-sheet-cat { padding: 12px 0 14px; border-bottom: 1px solid rgba(15,23,42,.06); }
  .mob-sheet-title { font-size: 15.5px; font-weight: 800; padding: 4px 0 8px; min-height: 0; }

  /* отклик на нажатие и фокус — как у остальных стеклянных кнопок */
  .mob-sheet-all:active,
  .mob-sheet-quick a:active,
  .mob-sheet-subs a:active {
    transform: scale(.985); filter: brightness(.97);
    box-shadow: inset 0 2px 8px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.20);
  }
  .mob-sheet-all:focus-visible,
  .mob-sheet-quick a:focus-visible,
  .mob-sheet-subs a:focus-visible { outline: 2px solid rgba(91,164,224,.9); outline-offset: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .mob-sheet-all, .mob-sheet-quick a, .mob-sheet-subs a { transition: none; }
  .mob-sheet-all:active, .mob-sheet-quick a:active, .mob-sheet-subs a:active { transform: none; }
}