/* ============================================================
   УЗТПА — выпадающее меню «Каталог» (виджет для Битрикс)
   Все селекторы ограничены #uztpa-catalog, чтобы НЕ влиять
   на стили сайта (сайт использует .row / .nav-item / .nav-link).
   Путь к шрифту при необходимости поправьте под свой шаблон.
   ============================================================ */
@font-face{
  font-family:'DINNextStencil';
  src:url('/static/menu/DINNextStencil-Heavy.ttf') format('truetype');
  font-weight:800;font-style:normal;font-display:swap;
}
#uztpa-catalog{position:static;}
#uztpa-catalog *{box-sizing:border-box;margin:0;padding:0;}

#uztpa-catalog .drawer{
  position:absolute;top:100%;left:0;width:380px;max-width:92vw;background:#fff;
  border-radius:0 0 12px 12px;border-top:3px solid #EE7A00;
  box-shadow:0 22px 55px rgba(0,0,0,.35);overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .26s cubic-bezier(.4,0,.2,1),visibility .26s,transform .26s cubic-bezier(.4,0,.2,1);
  z-index:1000;font-family:'Inter',system-ui,Arial,sans-serif;text-align:left;
}
#uztpa-catalog.open .drawer{opacity:1;visibility:visible;transform:none;}

#uztpa-catalog .drawer-head{background:#193B5C;color:#fff;display:flex;align-items:center;gap:12px;height:56px;padding:0 12px;}
#uztpa-catalog .dh-back{width:38px;height:38px;border:none;background:rgba(255,255,255,.10);color:#fff;border-radius:9px;font-size:22px;line-height:1;cursor:pointer;display:none;align-items:center;justify-content:center;flex-shrink:0;}
#uztpa-catalog .dh-back.show{display:flex;}
#uztpa-catalog .dh-title{flex:1;font-weight:700;font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#uztpa-catalog .dh-close{width:38px;height:38px;border:none;background:transparent;color:#fff;font-size:26px;line-height:1;cursor:pointer;}

#uztpa-catalog .viewport{position:relative;height:min(440px,70vh);overflow:hidden;}
#uztpa-catalog .panel{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#fff;transform:translateX(100%);transition:transform .26s cubic-bezier(.4,0,.2,1);}
#uztpa-catalog .panel.active{transform:none;}
#uztpa-catalog .panel.pushed{transform:translateX(-22%);}

#uztpa-catalog .section-label{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:#8a94a3;font-weight:700;padding:16px 20px 6px;}
#uztpa-catalog .row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 20px;border-bottom:1px solid #eef1f5;color:#0f1b2d;text-decoration:none;font-size:15px;cursor:pointer;background:#fff;transition:background .15s;flex-wrap:nowrap;}
#uztpa-catalog .row:hover{background:#E6EBF2;}
#uztpa-catalog .row .lbl{flex:1;color:inherit;text-decoration:none;}
#uztpa-catalog .row .chev{flex-shrink:0;cursor:pointer;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#E6EBF2;color:#193B5C;font-size:22px;line-height:1;font-weight:700;transition:all .15s;margin-left:12px;}
#uztpa-catalog .row:hover .chev{background:#d8e2ee;}
#uztpa-catalog .row .chev:hover{background:#EE7A00;color:#fff;transform:scale(1.08);}
#uztpa-catalog .row.brand{font-family:'DINNextStencil','Inter',sans-serif;font-size:20px;letter-spacing:1px;color:#193B5C;}
#uztpa-catalog .row.leaf{color:#193B5C;font-weight:500;}
#uztpa-catalog .row.leaf .go{flex-shrink:0;margin-left:12px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#EE7A00;color:#fff;font-size:20px;line-height:1;font-weight:700;transition:all .15s;}
#uztpa-catalog .row.leaf:hover .go{transform:scale(1.08);box-shadow:0 2px 8px rgba(238,122,0,.4);}

/* Мобильная версия: панель на всю ширину под шапкой.
   62px — примерная высота шапки сайта, при необходимости поправьте. */
@media(max-width:900px){
  #uztpa-catalog .drawer{position:fixed;top:62px;left:0;right:0;width:100%;max-width:100%;border-radius:0;}
  #uztpa-catalog .viewport{height:calc(100vh - 62px - 56px);}
}