/* ====== apps_style.css ====== */

/* базовое */
:root{
  --brand:#ff0030;
  --ink:#201a14;
  --card:#fff;
  --line:#a17452;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#e2ceb5}
img{max-width:100%;display:block}
a{color:#bf1414;text-decoration:none}
a:hover{color:#df5252}
button{border:0;cursor:pointer;background:transparent}
input{outline:0}

/* обёртки приложения */
.tree_block{background:url("../../template/images/m_m_b.png"); background-size:cover; width:100%}
.tree_block_content{max-width:1240px;margin:0 auto;padding:60px 0 40px}

/* список категорий (верхняя плитка) */
.menu_list{border:1px dotted #fff;border-radius:20px;padding:50px 10px;background:transparent}
.menu_list_title{text-align:center;margin-bottom:10px}
.menu_list_title h2{font:700 28px/1 Roboto,sans-serif;color:#fff;margin:0}
.menu_list_cont{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.menu_list_item{width:150px}
.menu_list_item a{color:#fff;display:block;text-align:center}
.menu_pic_cont{height:80px;display:flex;align-items:center;justify-content:center}
.menu_pic_cont img{max-height:70%}
.menu_list_name{font:500 16px/1.2 Roboto,sans-serif;margin-top:6px}

/* зона блюд */
.four_block{width:100%}
.four_block_content{max-width:1240px;margin:0 auto;padding:10px 0 80px}
.menu_item_cont{display:flex;flex-direction:column;width:100%}
.eda_title h2{font:700 22px/1 Roboto,sans-serif;margin:8px 0 14px;color:#000}
.eda_cont{display:flex;flex-wrap:wrap;gap:16px;width:100%}

/* карточка блюда (облегчённая) */
.menu_item{width:310px;display:flex;border-radius:40px}
.card_cont{position:relative;width:285px;height:470px;margin:auto;background:var(--card);border-radius:30px;padding:20px}
.card_img{height:200px;display:flex}
.card_img img{margin:auto;max-width:100%;max-height:100%}
.card_name{min-height:70px;max-height:150px;text-align:center;color:#000;font:700 20px/1.25 BATANG, sans-serif;margin:0 auto}
.card_line{border-bottom:2px solid var(--line);margin:8px auto 16px}
.card_description{font:400 12px/1.45 Roboto,sans-serif;color:var(--ink);padding-bottom:12px}

/* инфо строка */
.menu_item_info{display:flex;align-items:center;justify-content:center;gap:14px}
.card_ves,
.card_price{font:700 18px/1 Roboto,sans-serif}
.card_col{display:flex;align-items:center;gap:10px}
.card_input{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);text-align:center;font:400 16px/30px Roboto,sans-serif}
.minus,.plus{font:700 18px/1 Roboto,sans-serif}

/* кнопка добавления */
.to_cart{
  position:absolute;left:50%;transform:translateX(-50%);
  bottom:-20px;width:244px;height:57px;border-radius:40px;
  background:var(--brand);color:#fff;font:500 16px/57px Roboto,sans-serif;text-align:center
}
.to_cart:hover{background:#c60428;transition:.2s}

/* всплывашка-подсказка (оставляем как есть) */
.help_cart{
  display:none;position:fixed;right:10px;bottom:10px;z-index:5;
  background:url('../../template/images/icon/black.png');
  color:#fff;border-radius:15px;padding:16px;font:400 16px/1.4 Roboto,sans-serif
}
.help_cart a{color:#ff0e3b;font-weight:700}

/* счётчик корзины в шапке (если показывается) */
.header_cart{position:relative}
/* .cart_number{position:absolute;top:-10px;width:auto;text-align:left;font:700 17px/1 Roboto;} */
.cart_number {
    position: absolute;
    top: -20px;
    left: 2px;
    width: auto;
    text-align: left;
    font: 700 17px / 1 Roboto;
}

/* утилиты */
.loading{opacity:.8;font:400 16px/1.3 Roboto,sans-serif}

.apps-footer{
  background:#1f1a17; color:#fff; padding:16px; margin-top:24px;
}
.apps-footer__row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.apps-footer__brand{display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none;}
.apps-footer__logo{height:32px; width:auto; display:block;}
.apps-footer__title{font-weight:700; letter-spacing:.5px;}
.apps-footer__phone{font-weight:700; color:#fff; text-decoration:none;}
.apps-footer__info{margin-top:10px; font-size:14px; opacity:.9; line-height:1.4;}



/* иконки категорий */
.menu_list_item {
  width: 90px;
  height: auto;
  margin: 10px;
  text-align: center;
}

.menu_pic_cont {
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 6px;
}

.menu_pic_cont img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
}

.menu_list_name {
  font-size: 14px;
  line-height: 1.2;
  color: #fff;
}


/* карточки блюд */
.eda_cont {
  display: flex;
  flex-wrap: wrap;
  gap: 20px; /* расстояние между карточками */
}

.menu_item {
  flex: 1 1 calc(50% - 20px); /* по две карточки в ряд */
  box-sizing: border-box;
}

.menu_item .card_cont {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  padding: 10px;
}


/* ====== APPS HEADER ====== */
.apps-header {
  position: sticky; top: 0; left: 0; right: 0;
  z-index: 41;
  background: var(--paper, #e4cfae);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.apps-header .header-cont{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:12px 16px;
}

/* логотип слева */
.apps-header .f_h_logo { display:flex; align-items:center; gap:10px; }
.apps-header .f_h_logo img { width:40px; height:40px; display:block; }
.apps-header .f_h_logo .f_logo_text{ display:none; } /* в приложении текст не нужен */

/* корзина справа */
.apps-header .header_cart{ display:flex; align-items:center; gap:8px; }
.apps-header .cart_button img{ width:28px; height:28px; display:block; }
/* .apps-header .cart_number{
  min-width:18px; height:18px; padding:0 4px;
  border-radius:10px; background:#ff0030; color:#fff;
  font-size:12px; line-height:18px; text-align:center;
} */
.apps-header .cart_number {
    min-width: 26px;
    height: 20px;
    padding: 0 4px;
    border-radius: 10px;
    background: #ff0030;
    color: #fff;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
}
/* красная круглая кнопка-«гамбургер» */
.apps-hamburger{
  position:fixed; left:16px; top:84px;
  width:44px; height:44px; border-radius:12px;
  background:#ff0030; color:#fff; border:none; outline:none;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(255,0,48,.25);
  z-index:1001;
}
.apps-hamburger i{ font-size:20px; }

/* ВАЖНО: прячем старое мобильное меню сайта */
.right_menu{ display:none !important; }

/* ====== DRAWER (левое меню категорий) ====== */
.apps-drawer{
  position:fixed; inset:0 auto 0 0; width:290px; max-width:86%;
  background:#1f1f1f; color:#fff; overflow:auto;
  transform:translateX(-100%); transition:transform .25s ease;
  z-index:1002; padding:14px 12px 24px;
}
.apps-drawer[aria-hidden="false"]{ transform:translateX(0); }

.apps-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.25);
  opacity:0; pointer-events:none; transition:opacity .2s ease;
  z-index:1001;
}
.apps-backdrop[aria-hidden="false"]{ opacity:1; pointer-events:auto; }

/* сетка иконок в drawer-е */
.apps-drawer .tree_menu_fix{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px;
}
.apps-drawer .menu_list_item{ text-align:center; }
.apps-drawer .menu_pic_cont{
  height:64px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06); border-radius:12px;
  margin-bottom:6px;
}
.apps-drawer .menu_pic_cont img{ max-height:70%; max-width:76%; object-fit:contain; }
.apps-drawer .menu_list_name{ font-size:13px; line-height:1.25; color:#fff; }

/* ====== КАРТОЧКИ БЛЮД ====== */
.apps-content{ padding:12px 16px 64px; }
#cat_title{ margin:6px 0 10px; }

.eda_cont{
  display:grid; grid-template-columns:1fr; gap:18px; /* отступы между карточками */
}

/* по 2 карточки от 480px, по 3 — от 1000px */
@media (min-width:480px){
  .eda_cont{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px; }
}
@media (min-width:1000px){
  .eda_cont{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:22px; }
}

.menu_item{ display:block; }
.menu_item .card_cont{
  background:#fff; border-radius:16px; padding:12px 12px 16px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}

/* изображение блюда */
.card_img{ display:flex; align-items:center; justify-content:center; margin-bottom:10px; }
.card_img img{ width:100%; height:auto; border-radius:12px; display:block; }

/* кнопка «добавить в корзину» — не вываливалась вниз на мобильных */
.card_cont .to_cart{
  width:100%; margin-top:10px;
  display:inline-flex; align-items:center; justify-content:center;
}

/* тонкая линия/разделитель внутри карточки, если используется */
.card_line{ height:2px; background:#eee; margin:8px 0 10px; border-radius:1px; }

/* ====== ИКОНКИ КАТЕГОРИЙ СВЕРХУ СТРАНИЦЫ (если вдруг выводишь не в drawer) ====== */
.menu_list_cont .tree_menu_fix{
  display:flex; flex-wrap:wrap; gap:10px;
}
.menu_list_item{
  width:90px; text-align:center;
}
.menu_pic_cont{ height:70px; display:flex; align-items:center; justify-content:center; margin-bottom:6px; }
.menu_pic_cont img{ max-height:100%; max-width:100%; object-fit:contain; }
.menu_list_name{ font-size:14px; color:#fff; line-height:1.2; }

/* косметика заголовков */
.eda_title h2{ margin:8px 0 6px; }


/* --- Отключаем старую flex-сетку карточек --- */
.eda_cont{ display: grid !important; grid-template-columns: 1fr; gap: 18px; }
.menu_item{ flex: unset !important; box-sizing: border-box; width: auto !important; }

/* По 2 карточки от 560px, по 3 — от 1024px */
@media (min-width:560px){
  .eda_cont{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
}
@media (min-width:1024px){
  .eda_cont{ grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
}

/* --- Убираем фиксированные размеры карточки --- */
.menu_item{ display:block; }
.menu_item .card_cont{
  width: 100% !important;
  height: auto !important;
  padding: 12px 12px 16px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

/* Картинка — резиновая, без фиксированной высоты */
.card_img{
  display:flex; align-items:center; justify-content:center;
  margin-bottom: 10px; height: auto !important;
}
.card_img img{
  width: 100%; height: auto; max-height: none; border-radius: 12px; display:block;
}

/* Заголовок и разделитель */
.card_name{ min-height:auto; max-height:none; margin: 0 0 8px; font-weight:700; line-height:1.25; }
.card_line{ height:2px; background:#eee; margin:8px 0 10px; border-radius:1px; }
/* добавь в apps_style.css в самый низ */
.apps-section h2{
  margin: 0 0 12px 0;
  padding: 0 4px;
  font-size: 22px;
}
.apps-hamburger { display: none !important; }
/* полупрозрачная подложка за меню */
.apps-backdrop{
  position: fixed;
  inset: 0;                 /* top/right/bottom/left:0 */
  background: rgba(0,0,0,.35);
  z-index: 35;
  display: none;            /* показываем только когда меню открыто */
}
.apps-backdrop.show{ display: block; }

/* Кнопка "добавить" — больше не absolute */
.to_cart{
  position: static !important;
  transform: none !important;
  width: 100% !important;
  height: 48px; line-height: 48px;
  margin-top: 12px;
  border-radius: 14px;
  display: inline-flex; align-items:center; justify-content:center;
}

/* Чуть компактнее счетчики */
.card_col{ gap:10px; }
.card_input{ width:34px; height:34px; line-height:34px; border-radius:50%; }


/* Карточка тянется по высоте колонки,
   кнопка уходит к низу */
.menu_item .card_cont{
  display:flex;               /* NEW */
  flex-direction:column;      /* NEW */
  height:100%;                /* NEW */
}

/* Заголовок: центр и фиксированная «высота на 2 строки» */
.card_name{
  text-align:center;                   /* центрируем */
  font-weight:700;
  line-height:1.25;
  margin:0 0 8px;
  display:-webkit-box;                 /* обрезаем на 2 строки */
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;

  /* высота под две строки текста (подстрой при желании) */
  min-height: calc(1.25em * 2);        /* ≈ две строки */
}

/* Кнопка прижимается к низу карточки */
.to_cart{
  margin-top:auto;                     /* NEW: уводим вниз */
  position: static !important;
  transform: none !important;
  width: 100% !important;
  height: 48px; line-height: 48px;
  border-radius: 14px;
  display: inline-flex; align-items:center; justify-content:center;
}


.card_img{
  margin-bottom:10px;
  aspect-ratio: 4 / 3;        /* одинаковая высота блока под фото */
  overflow:hidden;
}
.card_img img{
  width:100%; height:100%; object-fit:cover; border-radius:12px;
}



/* цена слева */
.card_price{
  font:700 18px/1 Roboto,sans-serif;
  color:#000;
  text-align:left !important;
}

/* граммовка справа */
.card_ves{
  font:700 18px/1 Roboto,sans-serif;
  color:#000;
  text-align:right !important;
}

/* выравниваем цену слева, вес справа и гасим <br> */
.menu_item .card_cont .menu_item_info{
  display:flex;
  align-items:center;
  justify-content:space-between;   /* <-- по краям */
  gap:12px;
  width:100%;
}

.menu_item .card_cont .menu_item_info .card_price{
  flex:1 1 50%;
  text-align:left !important;
}

.menu_item .card_cont .menu_item_info .card_ves{
  flex:1 1 50%;
  text-align:right !important;
}

/* если вёрстка подкидывает <br>, скрываем их внутри строки */
.menu_item .card_cont .menu_item_info br{ display:none !important; }

/* цена + вес в одной строке по краям */
.menu_item .card_cont .menu_item_info{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
}

/* цена слева */
.menu_item .card_cont .menu_item_info .card_price{
  flex:1 1 50%;
  text-align:left !important;
}

/* вес справа */
.menu_item .card_cont .menu_item_info .card_ves{
  flex:1 1 50%;
  text-align:right !important;
}

/* блок счётчика — отдельная строка по центру */
.menu_item .card_cont .card_col{
  display:flex;
  justify-content:center;   /* <-- центрируем */
  margin-top:8px;
  gap:10px;
}


/* цена слева, вес справа (оставляем как было) */
.menu_item .card_cont .menu_item_info{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
}

/* --- Центрируем строку со счётчиком, когда она лежит в .menu_item_info --- */
.menu_item .card_cont .menu_item_info > .card_col{
  /* центрируем сам блок счётчика относительно родителя */
  margin: 8px auto 0 !important;      /* сверху небольшой отступ, по краям auto => по центру */
  display:flex;
  align-items:center;
  justify-content:center;  /* центр внутри блока */
  gap:10px;
}

/* (необязательно) современный вариант: если поддерживается :has() */
@supports selector(.menu_item_info:has(.card_col)) {
  .menu_item .card_cont .menu_item_info:has(> .card_col){
    justify-content:center;   /* родитель, содержащий только счётчик, центрируем */
  }
}


/* ==== FIXED BOTTOM NAV ==== */
.apps-bottom-nav{
  position:fixed; left:0; right:0; bottom:0;
  height:64px; z-index:1003;
  background:#1f1a17; color:#fff;
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.08);
}

.apps-tab{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; width:100%; height:100%;
  color:#fff; font:500 12px/1 Roboto,system-ui,sans-serif;
}

.apps-tab i{ font-size:18px; }
.apps-tab:active{ background:rgba(255,255,255,.06); }

.apps-tab.is-active{ color:#ff0030; }
.apps-tab.is-active i{ transform: translateY(-1px); }

.apps-tab__badge{
  position:absolute; margin-left:14px; margin-top:-30px;
  min-width:18px; height:18px; padding:0 5px;
  border-radius:10px; background:#ff0030; color:#fff;
  font:700 12px/18px Roboto,sans-serif; text-align:center;
}

/* чтобы контент не уезжал под панель */
.apps-content{ padding-bottom: 88px !important; }

/* верхнюю фикс-панель скрываем полностью (если где-то осталась) */
.apps-header, .fake_header, .right_menu{ display:none !important; }



/* ===== Apps overrides (mobile-first) ===== */

/* Спрятать верхнюю шапку и правое меню в приложении */
.apps-header, .right_menu { display:none !important; }

/* Контент: низ не перекрывается панелью, учитываем вырез iOS */
.apps-content{
  padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}

/* ==== Карточки: 2 плитки в ряд на мобилке ==== */
.eda_cont{
  display:flex; flex-wrap:wrap; gap:12px;
}
.eda_cont .menu_item{
  width: calc(50% - 6px);
  border-radius:16px; overflow:hidden;
}
.eda_cont .menu_item .card_cont{ border-radius:16px; }
.eda_cont .menu_item .card_img img{ border-radius:14px; }

/* Заголовок блюда — короче и плотнее */
.eda_cont .menu_item .menu_item_title{
  font-size:14px; line-height:1.25; height:auto; min-height:0;
  margin:8px 0 0;
}

/* Строка цена / граммовка — покрупнее и ровно по краям */
.eda_cont .menu_item .menu_item_info{
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; margin:8px 0 6px;
  font-size:15px; font-weight:600;
}
.eda_cont .menu_item .menu_item_info br{ display:none; }

/* Счётчик количества — строго по центру */
.eda_cont .menu_item .menu_item_nal{
  display:flex; align-items:center; justify-content:center; gap:12px;
  margin:6px 0 10px;
}
.eda_cont .menu_item .menu_item_nal button{ width:28px; height:28px; font-size:18px; }
.eda_cont .menu_item .menu_item_nal .pin_inp{ width:34px; height:28px; font-size:14px; }

/* Кнопка «в корзину» — на всю ширину, жирнее */
.eda_cont .menu_item .to_cart{
  width:100%; border-radius:12px; padding:10px 12px;
  font-size:13px; font-weight:700; letter-spacing:.2px;
}

/* На планшете 3 в ряд, на десктопе 4 (если понадобится) */
@media (min-width: 768px){
  .eda_cont .menu_item{ width: calc(33.333% - 8px); }
}
@media (min-width: 1100px){
  .eda_cont .menu_item{ width: calc(25% - 9px); }
}

/* ==== Нижняя фикс-панель ==== */
.apps-bottom-nav{
  position:fixed; left:0; right:0; bottom:0;
  height:72px; z-index:40;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background:#1f1a17; color:#fff;
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.08);
}
.apps-bottom-nav .apps-tab{
  position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; height:100%; color:#fff; font:600 12px/1.1 system-ui, -apple-system, Roboto, Arial, sans-serif;
  -webkit-tap-highlight-color: transparent;
}
.apps-bottom-nav .apps-tab i{ font-size:24px; }        /* крупнее иконки */
.apps-bottom-nav .apps-tab span{ white-space:nowrap; }
.apps-bottom-nav .apps-tab:active{ background:rgba(255,255,255,.06); }
.apps-bottom-nav .apps-tab.is-active{ color:#ff0030; }
.apps-bottom-nav .apps-tab.is-active i{ transform: translateY(-1px); }

.apps-tab__badge{
  position:absolute; top:32px; right:28%;
  min-width:18px; height:18px; padding:0 5px;
  border-radius:10px; background:#ff0030; color:#fff;
  font:800 12px/18px system-ui, sans-serif; text-align:center;
}

/* Небольшой апскейл шрифта на очень маленьких экранах */
@media (max-width: 340px){
  .apps-bottom-nav{ height:68px; }
  .apps-bottom-nav .apps-tab i{ font-size:22px; }
  .apps-bottom-nav .apps-tab{ font-size:11px; }
}

/* ==== Drawer (левое меню) — делаем читаемым на мобилке ==== */
.apps-drawer { width: 86vw; max-width: 360px; }
.apps-drawer h3 { font-size: 18px; margin: 8px 12px 10px; }
.apps-drawer .cat-link{
  padding:12px 14px;
  font:600 16px/1.2 system-ui, -apple-system, Roboto, Arial, sans-serif;
}
.apps-drawer .cat-link img{
  width:36px; height:36px; border-radius:8px;
}

/* подложка — показывать когда меню открыто */
.apps-backdrop{ display:none; }
.apps-backdrop.show{ display:block; }

/* ==== Карточки: 2 в ряд на мобиле ==== */
.eda_cont{
  display:flex; flex-wrap:wrap; gap:12px !important;
}
.eda_cont .menu_item{
  width: calc(50% - 6px) !important;
  border-radius:16px; overflow:hidden;
}
.eda_cont .menu_item .card_cont{
  border-radius:16px; padding:12px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}

/* Фотография с одинаковым соотношением сторон */
.card_img{ margin-bottom:10px; aspect-ratio: 4 / 3; overflow:hidden; }
.card_img img{ width:100%; height:100%; object-fit:cover; border-radius:12px; }

/* Название — короче, жирнее */
.card_name{
  margin:0 0 8px; text-align:center; font-weight:700;
  line-height:1.25; font-size:14px;        /* было слишком мелко */
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
}

/* Цена и граммовка — крупно и по краям в одну строку */
.menu_item .menu_item_info,
.menu_item .card_cont .menu_item_info{
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; margin:8px 0 6px; font-weight:700; font-size:15px;
}
.menu_item .menu_item_info br{ display:none !important; }  /* прибиваем <br> */
.card_price, .card_ves{ font-weight:700; }

/* Счётчик по центру, кнопка на всю ширину */
.menu_item .card_cont .card_col,
.eda_cont .menu_item .menu_item_nal{
  display:flex; align-items:center; justify-content:center; gap:12px; margin:6px 0 10px;
}
.card_input, .pin_inp{ width:34px; height:30px; line-height:30px; font-size:14px; }
.minus, .plus{ font-size:18px; }

.to_cart{
  width:100% !important; height:48px; line-height:48px;
  border-radius:14px; font-weight:800; letter-spacing:.2px;
  position: static !important; transform: none !important; margin-top:auto;
}

/* ==== Нижняя панель: делаем иконки заметнее ==== */
.apps-bottom-nav{ height:72px; padding-bottom: env(safe-area-inset-bottom, 0px); }
.apps-bottom-nav .apps-tab{
  position:relative; gap:6px;
  font:600 12px/1.1 system-ui, -apple-system, Roboto, Arial, sans-serif;
}
.apps-bottom-nav .apps-tab i{ font-size:24px; }   /* крупные иконки */
/* .apps-tab__badge{
  position:absolute; top:8px; right:28%;
  min-width:18px; height:18px; padding:0 5px;
  border-radius:10px; background:#ff0030; color:#fff;
  font:800 12px/18px system-ui, sans-serif; text-align:center;
} */

/* очень узкие экраны */
@media (max-width:340px){
  .apps-bottom-nav{ height:68px; }
  .apps-bottom-nav .apps-tab i{ font-size:22px; }
  .apps-bottom-nav .apps-tab{ font-size:11px; }
}

/* планшет: 3 в ряд, десктоп: 4 (опционально) */
@media (min-width:768px){ .eda_cont .menu_item{ width: calc(33.333% - 8px) !important; } }
@media (min-width:1100px){ .eda_cont .menu_item{ width: calc(25% - 9px) !important; } }


/* === APPS: окончательная фиксация карточек и сетки === */

/* Сетка блюд: по умолчанию 2 в ряд */
.apps-content .eda_cont{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 14px !important;
}

/* Планшет/десктоп */
@media (min-width: 900px){
  .apps-content .eda_cont{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}
@media (min-width: 1200px){
  .apps-content .eda_cont{ grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
}

/* Карточка: убираем все старые фикс-размеры */
.apps-content .menu_item{
  width: auto !important;
  flex: none !important;
  display: block !important;
  border-radius: 16px !important;
}
.apps-content .menu_item .card_cont{
  width: 100% !important;
  height: auto !important;
  padding: 12px 12px 16px !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Картинка — всегда резиновая, одинаковое соотношение */
.apps-content .card_img{
  margin-bottom: 10px !important;
  height: auto !important;
  aspect-ratio: 4/3 !important;
  overflow: hidden !important;
}
.apps-content .card_img img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 12px !important;
  max-width: none !important;
  max-height: none !important;
}

/* Заголовок — 2 строки, центр */
.apps-content .card_name{
  margin: 0 0 8px !important;
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Цена слева, вес справа, без <br> */
.apps-content .menu_item .menu_item_info{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 6px 0 !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}
.apps-content .menu_item .menu_item_info br{ display:none !important; }
.apps-content .menu_item .menu_item_info .card_price{
  text-align: left !important; flex: 1 1 50% !important;
}
.apps-content .menu_item .menu_item_info .card_ves{
  text-align: right !important; flex: 1 1 50% !important;
}

/* Счётчик по центру отдельной строкой */
.apps-content .menu_item .card_col{
  display:flex !important; align-items:center !important; justify-content:center !important;
  gap:12px !important; margin:8px 0 0 !important;
}
.apps-content .card_input{ width:34px !important; height:30px !important; line-height:30px !important; font-size:14px !important; }
.apps-content .minus, .apps-content .plus{ font-size:18px !important; }

/* Кнопка — на всю ширину внизу карточки */
.apps-content .to_cart{
  position: static !important; transform:none !important;
  width: 100% !important; height: 48px !important; line-height:48px !important;
  border-radius: 14px !important; margin-top: auto !important;
  font-weight: 800 !important; letter-spacing: .2px !important;
}

/* Заголовок раздела — аккуратный отступ */
.apps-section h2{ margin: 0 0 12px 0 !important; font-size: 22px !important; }

/* На очень узких экранах — 1 в ряд */
@media (max-width: 360px){
  .apps-content .eda_cont{ grid-template-columns: 1fr !important; }
}


/* === APPS: мобайл 2 колонки, планшет 3, десктоп 4 === */

/* Телефоны — 2 в ряд */
@media (max-width: 767.98px){
  .apps-content .eda_cont{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 14px !important;
  }
  /* глушим любые «flex-остатки» и фикс-ширины */
  .apps-content .eda_cont > .menu_item{
    width: auto !important; flex: initial !important;
  }
}

/* Очень узкие телефоны — 1 в ряд */
@media (max-width: 360px){
  .apps-content .eda_cont{
    grid-template-columns: 1fr !important;
  }
}

/* Планшеты — 3 в ряд */
@media (min-width: 768px) and (max-width: 1199.98px){
  .apps-content .eda_cont{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 20px !important;
  }
}

/* Десктоп — 4 в ряд (при желании можно убрать) */
@media (min-width: 1200px){
  .apps-content .eda_cont{
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    gap: 22px !important;
  }
}

/* ——— Карточка: убираем старые фикс-размеры и увеличиваем читаемость ——— */
.apps-content .menu_item .card_cont{
  width: 100% !important; height: auto !important;
  padding: 14px 14px 16px !important;
  border-radius: 16px !important;
  display: flex !important; flex-direction: column !important;
}
.apps-content .card_img{ aspect-ratio: 4 / 3 !important; margin-bottom: 10px !important; overflow: hidden !important; }
.apps-content .card_img img{ width:100% !important; height:100% !important; object-fit: cover !important; border-radius:12px !important; }

/* Заголовок блюда — крупнее */
.apps-content .card_name{
  font-size: 15px !important; line-height: 1.3 !important;
  margin: 0 0 8px !important; text-align: center !important;
  display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important;
}

/* Цена слева, граммовка справа — ещё крупнее */
.apps-content .menu_item .menu_item_info{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  gap:10px !important; margin:8px 0 6px !important;
  font-weight: 700 !important; font-size: 16px !important;
}
.apps-content .menu_item .menu_item_info br{ display:none !important; }

/* Счётчик — по центру */
.apps-content .menu_item .card_col{
  display:flex !important; align-items:center !important; justify-content:center !important;
  gap:12px !important; margin-top:8px !important;
}
.apps-content .card_input{ width:36px !important; height:32px !important; line-height:32px !important; font-size:15px !important; }
.apps-content .minus, .apps-content .plus{ font-size:20px !important; }

/* Кнопка — крупнее и на всю ширину, прижата вниз */
.apps-content .to_cart{
  position: static !important; transform:none !important;
  width:100% !important; height:52px !important; line-height:52px !important;
  border-radius:14px !important; margin-top:auto !important;
  font-weight:800 !important; font-size:14px !important; letter-spacing:.2px !important;
}

/* ——— Drawer (выдвижное меню) — крупнее и совместимо с .open ——— */
.apps-drawer{
  width: 88vw !important; max-width: 380px !important;
  transform: translateX(-100%); transition: transform .25s ease;
}
.apps-drawer.open{ transform: translateX(0) !important; }          /* под твой JS addClass('open') */
.apps-backdrop{ display:none; }
.apps-backdrop.show{ display:block; }
.apps-drawer h3{ font-size:18px !important; margin:10px 14px !important; }
.apps-drawer .cat-link{
  padding:14px 16px !important;
  font: 600 16px/1.2 system-ui, -apple-system, Roboto, Arial, sans-serif !important;
}
.apps-drawer .cat-link img{ width:40px !important; height:40px !important; border-radius:8px !important; }

/* ——— Нижняя навигация — оставляем крупные иконки и подпись ——— */
.apps-bottom-nav{ height:72px !important; }
.apps-bottom-nav .apps-tab{ font:600 12px/1.1 system-ui,-apple-system,Roboto,Arial,sans-serif !important; }
.apps-bottom-nav .apps-tab i{ font-size:24px !important; }


/* Кнопка "Добавить в корзину" — фикс центрирования и переносов */
.apps-content .to_cart{
  position: static !important;
  transform: none !important;
  width: 100% !important;

  /* Центрирование текста по современному способу */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;

  height: 52px !important;
  line-height: 1 !important;     /* убираем «подпрыгивание» текста */
  padding: 0 12px !important;
  border-radius: 14px !important;

  font-weight: 800 !important;
  font-size: 14px !important;
  letter-spacing: .2px !important;
  white-space: nowrap;           /* чтобы фраза не ломалась на две строки */
}


/* ====== КНОПКА: компактная и/или перенос ====== */

/* По умолчанию: одна строка, компактнее */
.apps-content .to_cart{
  display:flex !important; align-items:center !important; justify-content:center !important;
  width:100% !important; height:52px !important; line-height:1 !important;
  padding:0 12px !important; border-radius:14px !important;
  font-weight:800 !important; font-size:14px !important; letter-spacing:.2px !important;
  white-space:nowrap !important;
}

/* Если вдруг хочешь перенос вместо сокращения — раскомментируй блок ниже и удали JS:
.apps-content .to_cart{ white-space:normal !important; height:auto !important; min-height:48px !important; padding:10px 12px !important; }
*/

/* ====== СЧЁТЧИК: строго по центру ====== */
.apps-content .menu_item .card_col{
  display:flex !important; justify-content:center !important; align-items:center !important;
  gap:14px !important; margin:8px 0 10px !important; text-align:center !important;
}
.apps-content .menu_item .card_col *{ float:none !important; } /* глушим старые float'ы */

.apps-content .minus, .apps-content .plus{
  flex:0 0 36px !important; width:36px !important; height:36px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  border-radius:10px !important; font-size:20px !important;
}
.apps-content .card_input{
  flex:0 0 38px !important; width:38px !important; height:34px !important;
  line-height:34px !important; text-align:center !important; font-size:15px !important;
}

/* Кнопка "В корзину" — единый стиль для всех экранов */
.apps-content .to_cart{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:100% !important;
  height:52px !important;
  line-height:1 !important;

  padding:0 12px !important;
  border-radius:14px !important;

  font-weight:800 !important;
  font-size:14px !important;
  letter-spacing:.2px !important;

  white-space:nowrap !important;
}

/* Счётчик по центру */
.apps-content .menu_item .card_col{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:14px !important;
  margin:8px 0 10px !important;
  text-align:center !important;
}
.apps-content .menu_item .card_col *{ float:none !important; }

.apps-content .minus, .apps-content .plus{
  flex:0 0 36px !important;
  width:36px !important; height:36px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  border-radius:10px !important;
  font-size:20px !important;
}
.apps-content .card_input{
  flex:0 0 38px !important;
  width:38px !important; height:34px !important;
  line-height:34px !important;
  text-align:center !important;
  font-size:15px !important;
}

.apps-footer {
  padding: 70px 16px calc(100px + env(safe-area-inset-bottom, 0px)) 16px;
  background: #1f1a17;
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
}

/* Плейсхолдер пустой категории */
.apps-empty{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; padding:40px 16px; text-align:center; color:#7a7168;
}
.apps-empty i{ font-size:42px; opacity:.45; }
.apps-empty__title{ font-weight:600; font-size:18px; color:#1f1a17; }
.apps-empty__text{ font-size:14px; }

/* Чтобы подвал не «подскакивал», растягиваем секцию,
   когда в ней плейсхолдер пустоты */
.apps-empty--stretch{ min-height:40vh; }

/* Чуть больше «воздуха» внизу контента под фикс-навигацию */
.apps-content{ padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; }



/* Скелет-заглушка на время загрузки */
.apps-skeleton {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
  padding: 8px 2px 22px;
  min-height: 46vh; /* чтобы подвал не подпрыгивал */
}
@media (min-width: 768px){
  .apps-skeleton{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.skel-card{
  border-radius: 14px; background: #fff; padding: 10px; box-shadow: 0 6px 18px rgba(0,0,0,.08);
  overflow: hidden;
}
.skel-img{ height: 120px; border-radius: 10px; background: #eee; }
.skel-line{ height: 12px; margin-top: 10px; border-radius: 8px; background: #eee; }
.skel-line.short{ width: 60%; }
.skel-line.tiny{ width: 40%; }

/* На всякий пожарный — когда вообще пусто */
.apps-empty--stretch{ min-height: 40vh; }


/* скелет: карточка */
.skel-card{
  border-radius: 16px;
  background: #fff;
  padding: 12px;
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
  overflow: hidden;
}

/* «растворяем» контейнер скелета внутри реальной сетки .eda_cont */
.eda_cont .apps-skeleton{
  display: contents;         /* <-- ключевая строка: берем ширину колонок .eda_cont */
}

/* сами «кости» */
.skel-img{ height: 140px; border-radius: 12px; background:#eee; }
.skel-line{ height: 12px; margin-top: 10px; border-radius: 8px; background:#eee; }
.skel-line.short{ width: 60%; }
.skel-line.tiny{  width: 40%; }

/* когда список совсем пуст — чтобы подвал не подпрыгивал */
.apps-empty--stretch{ min-height: 40vh; }


/* ===== Всплывающее сообщение «добавлено в корзину» ===== */
#help_cart{
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: calc(88px + env(safe-area-inset-bottom, 0px) + 14px) !important; /* чуть выше нижней навигации */
  z-index: 3000 !important;          /* выше bottom-nav и всего остального */
  background: #111;
  color: #fff;
  padding: 12px 16px;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  line-height: 1.3;
  text-align: center;
  max-width: min(520px, 92vw);
  pointer-events: auto;
}

/* на маленьких экранах можно поднять ещё на пару пикселей */
@media (max-width: 420px){
  #help_cart{ bottom: calc(88px + env(safe-area-inset-bottom, 0px) + 18px) !important; }
}


