/* Bar */
.rcomcm-bar{display:flex;gap:1rem;align-items:center}
.rcomcm-trigger{display:inline-flex;gap:.35rem;align-items:center;padding:.45rem .7rem;border-radius:10px;text-decoration:none;transition:transform .15s ease, background .15s ease}
.rcomcm-trigger:hover{transform:translateY(-1px)}
.rcomcm-caret{font-size:.85em;transition:transform .2s ease}
.rcomcm-trigger[aria-expanded="true"] .rcomcm-caret{transform:rotate(180deg)}

/* Popover */
.rcomcm-popover{position:absolute;left:0;right:0;top:100%;z-index:99999;padding:16px;display:block;pointer-events:none}
.rcomcm-popover[aria-hidden="true"]{display:block;opacity:0;visibility:hidden;height:0}
.rcomcm-popover[aria-hidden="false"]{opacity:1;visibility:visible;height:auto;pointer-events:auto}
.rcomcm-popover-inner{position:relative;max-width:1280px;margin:0 auto;background:#fff;border-radius:22px;box-shadow:0 20px 60px rgba(0,0,0,.16);padding:16px 26px;transform-origin:50% 0;animation:rcomcm-pop .22s ease both}
@keyframes rcomcm-pop{from{opacity:.0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Scroll wrapper */
.rcomcm-scroll{max-height:calc(100vh - 220px); overflow:auto; overscroll-behavior:contain; padding:10px 6px 18px 6px; scrollbar-gutter:stable}

/* Fades */
.rcomcm-popover-inner:before,
.rcomcm-popover-inner:after{
  content:""; position:absolute; left:0; right:0; height:36px; pointer-events:none; transition:opacity .15s ease;
}
.rcomcm-popover-inner:before{ top:0; border-radius:22px 22px 0 0; background:linear-gradient(#ffffff, rgba(255,255,255,0)); opacity:0; }
.rcomcm-popover-inner:after{ bottom:0; border-radius:0 0 22px 22px; background:linear-gradient(rgba(255,255,255,0), #ffffff); opacity:0; }
.rcomcm-popover-inner.rcomcm-can-up:before{ opacity:1; }
.rcomcm-popover-inner.rcomcm-can-down:after{ opacity:1; }

/* Grid & Tiles */
.rcomcm-grid{display:grid;grid-template-columns:repeat(var(--rc-cols,5), minmax(200px,1fr));gap:22px;align-items:stretch}
.rcomcm-tile{display:flex;flex-direction:column;align-items:center;gap:12px;border-radius:16px;padding:12px;background:#fafafa;text-align:center;transition:transform .18s ease, box-shadow .18s ease}
.rcomcm-tile:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(0,0,0,.10)}
.rcomcm-tile img{width:100%;height:260px;object-fit:cover;border-radius:14px;transition:transform .25s ease}
.rcomcm-tile:hover img{transform:scale(1.06)}
.rcomcm-title{font-size:1.02rem}
@media (max-width:1200px){.rcomcm-grid{grid-template-columns:repeat(4, minmax(180px,1fr))} .rcomcm-tile img{height:230px}}
@media (max-width:768px){.rcomcm-grid{grid-template-columns:repeat(2, minmax(160px,1fr))} .rcomcm-tile img{height:200px}}

/* Arrows */
.rcomcm-arrow{position:absolute; left:50%; transform:translateX(-50%); width:38px; height:38px; border:none; border-radius:20px; background:#fff; box-shadow:0 8px 24px rgba(0,0,0,.12); display:flex; align-items:center; justify-content:center; font-size:18px; cursor:pointer; opacity:0; pointer-events:none; transition:opacity .2s ease}
.rcomcm-arrow--up{ top:6px; animation:rcomcm-bounceUp 1.4s infinite ease-in-out }
.rcomcm-arrow--down{ bottom:6px; animation:rcomcm-bounceDown 1.4s infinite ease-in-out }
.rcomcm-popover-inner.rcomcm-can-up .rcomcm-arrow--up{ opacity:1; pointer-events:auto }
.rcomcm-popover-inner.rcomcm-can-down .rcomcm-arrow--down{ opacity:1; pointer-events:auto }
@keyframes rcomcm-bounceUp{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-4px)}}
@keyframes rcomcm-bounceDown{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,4px)}}

/* Ensure dropdown isn't clipped by header */
#header,.header-nav,.header-top{position:relative; z-index:50; overflow:visible}
/* upewniamy się, że strzałki są na wierzchu */
.rcomcm-popover-inner { position: relative; z-index: 2; }
.rcomcm-scroll        { position: relative; z-index: 1; }
.rcomcm-arrow         { z-index: 5; }                 /* <— kluczowe */
.rcomcm-popover-inner:before,
.rcomcm-popover-inner:after { pointer-events: none; }

/* bardzo wysoki z-index dla dropdownu */
.rcomcm-popover{ z-index:2147483000; }

/* upewnij się, że nic nie przykrywa strzałek */
.rcomcm-popover-inner{ position:relative; z-index:2; }
.rcomcm-scroll{ position:relative; z-index:1; }

/* strzałki na wierzchu + delikatne opuszczenie górnej */
.rcomcm-arrow{ z-index:5; }
.rcomcm-arrow--up{ top:12px; }

/* sterowanie aktywnością strzałek przez atrybut disabled */
.rcomcm-arrow[disabled]{ opacity:0; pointer-events:none; }

/* (opcjonalnie) gradienty nie łapią klików */
.rcomcm-popover-inner:before,
.rcomcm-popover-inner:after{ pointer-events:none; }