.boc-wrap{max-width:1200px;margin:0 auto;}
.boc-card{background:rgba(20,24,28,.75);backdrop-filter: blur(8px); border:1px solid rgba(255,255,255,.08); border-radius:22px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
.boc-pad{padding:18px;}
.boc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
@media(max-width: 1000px){ .boc-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media(max-width: 560px){ .boc-grid{grid-template-columns:1fr;} }
.boc-label{display:block;font-size:12px;opacity:.85;margin-bottom:6px;}
.boc-input,.boc-select{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.25)!important;color:#fff!important;padding:12px 12px;outline:none;}
.boc-input:focus,.boc-select:focus{border-color:rgba(0,160,255,.55);}
.boc-actions{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:12px;flex-wrap:wrap;}
.boc-btn{border:0;border-radius:14px;padding:12px 14px;background:rgba(0,160,255,.35);color:#fff;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;}
.boc-btn:hover{background:rgba(0,160,255,.5);}
.boc-btn-secondary{background:rgba(255,255,255,.12);}
.boc-btn-secondary:hover{background:rgba(255,255,255,.18);}
.boc-hint{font-size:12px;opacity:.8}
.boc-results{margin-top:16px;padding-bottom:110px;}
.boc-grid-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
@media(max-width:1000px){.boc-grid-cards{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:560px){.boc-grid-cards{grid-template-columns:1fr;}}
.boc-title{margin:0;font-size:22px;font-weight:700;letter-spacing:.2px;line-height:1.15;width:100%;text-align:center;}
.boc-title a{color:#fff;text-decoration:none;}
.boc-top{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin-bottom:10px;text-align:center;}
.boc-badges{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}

/* Mobile polish */
@media (max-width:560px){
  .boc-top{gap:6px;margin-bottom:8px;}
  .boc-title{font-size:21px;}
}
.boc-badge{font-size:11px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.12);}
.boc-verified{background:rgba(0,200,120,.18);border:1px solid rgba(0,200,120,.25);}
.boc-pkg{background:rgba(255,215,0,.12);border:1px solid rgba(255,215,0,.2);}
.boc-thumb img{border-radius:18px;width:100%;height:auto;display:block;margin-bottom:10px;}
.boc-meta{font-size:12px;opacity:.9;margin-bottom:8px;}
.boc-excerpt{font-size:13px;opacity:.9;margin-bottom:12px;line-height:1.35;}
.boc-links{display:flex;gap:8px;flex-wrap:wrap;}
.boc-chip{font-size:12px;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.1);color:#fff;text-decoration:none;}
.boc-chip:hover{background:rgba(255,255,255,.16);}
.boc-empty,.boc-loading{padding:18px;text-align:center;opacity:.85;}
.boc-pager{margin-top:14px;display:flex;justify-content:center;}
.boc-pager-inner{display:flex;gap:10px;align-items:center;}
.boc-page-info{font-size:12px;opacity:.85}
.boc-msg{font-size:13px;opacity:.9}
.boc-msg.boc-ok{color:#a6ffcf}
.boc-listing.boc-gold{outline:1px solid rgba(255,215,0,.25)}
.boc-listing.boc-silver{outline:1px solid rgba(220,220,220,.18)}

/* Upgrade buttons */
.boc-upgrade{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.boc-btn-sm{padding:10px 12px;border-radius:12px;font-size:12px}
.boc-pkg-tag{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12)}

/* Single listing */
.boc-single{max-width:1100px;margin:0 auto}
.boc-back-link{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.85);text-decoration:none;margin:10px 0 16px 0}
.boc-back-link:hover{text-decoration:underline}
.boc-single__title{font-size:46px;line-height:1.05;margin:0 0 10px 0}
.boc-single__meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.boc-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);font-size:12px}
.boc-badge--gold{background:rgba(255,215,0,.12);border-color:rgba(255,215,0,.22)}
.boc-badge--silver{background:rgba(220,220,220,.10);border-color:rgba(220,220,220,.18)}
.boc-badge--ok{background:rgba(0,220,150,.12);border-color:rgba(0,220,150,.22)}
.boc-single__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.boc-single__main,.boc-single__aside{min-width:0}
.boc-hero{overflow:hidden}
.boc-hero img{width:100%;height:auto;display:block;border-radius:18px}
.boc-section-title{font-size:18px;margin:0 0 12px 0;display:flex;align-items:center;gap:10px}
.boc-section-title small{opacity:.75;font-weight:400;font-size:12px}
.boc-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.boc-info-item{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:12px}
.boc-info-label{opacity:.7;font-size:12px;margin-bottom:6px}
.boc-info-value{font-size:14px;word-break:break-word}
.boc-cta{display:flex;flex-wrap:wrap;gap:10px}
.boc-icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;border-radius:16px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.12);color:#fff;text-decoration:none}
.boc-icon-btn:hover{background:rgba(0,0,0,.34)}

@media (max-width: 860px){
  .boc-single__grid{grid-template-columns:1fr}
  .boc-single__title{font-size:36px}
  .boc-info-grid{grid-template-columns:1fr}
}

/* Modal (detail drawer) */
#boc-modal{position:fixed;inset:0;z-index:99999;display:none;}
#boc-modal.is-open{display:block;}
.boc-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter: blur(6px);}
.boc-modal__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(720px,92vw);max-height:86vh;overflow:auto;border-radius:22px;background:rgba(20,24,28,.92);border:1px solid rgba(255,255,255,.10);box-shadow:0 20px 60px rgba(0,0,0,.45);}
.boc-modal__head{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:16px 16px 10px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.boc-modal__title{margin:0;font-size:18px}
.boc-modal__close{border:0;background:rgba(255,255,255,.10);color:#fff;border-radius:12px;padding:10px 12px;cursor:pointer}
.boc-modal__close:hover{background:rgba(255,255,255,.16)}
.boc-modal__body{padding:16px}
.boc-modal__loading{opacity:.85}


/* Chips row (categories) */
.boc-chips-row{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 14px;margin-bottom:10px;-webkit-overflow-scrolling:touch;}
.boc-chip{flex:0 0 auto;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.86);padding:8px 12px;border-radius:999px;font-size:14px;line-height:1;cursor:pointer;user-select:none;}
.boc-chip--active{background:rgba(20,160,255,.22);border-color:rgba(20,160,255,.35);color:#fff;}
.boc-row--2{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:end;}
@media (max-width:680px){.boc-row--2{grid-template-columns:1fr;}}
.boc-field--check{display:flex;align-items:flex-end;padding-bottom:6px;}
.boc-check{display:flex;gap:10px;align-items:center;font-size:14px;color:rgba(255,255,255,.85);cursor:pointer;user-select:none;}
.boc-check input{accent-color:rgba(20,160,255,.85);}
.boc-results-meta{margin-top:10px;color:rgba(255,255,255,.70);font-size:13px;}

/* ===== v1.4.1 Premium Glass UI ===== */
.boc-hero{padding:16px 4px 8px}
.boc-hero__title{font-size:20px;font-weight:800;letter-spacing:.2px}
.boc-hero__sub{opacity:.8;margin-top:4px;font-size:13px}

.boc-filter{backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);background: rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10)}

/* Collapsible filter header */
.boc-filter__head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:2px 2px 16px 2px;cursor:pointer;user-select:none}
.boc-filter__title{font-weight:800;letter-spacing:.2px}
.boc-filter__toggle{display:flex;align-items:center;gap:10px;opacity:.85;font-size:13px}
.boc-filter__chev{width:32px;height:32px;border-radius:999px;display:flex;align-items:center;justify-content:center;background: rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.boc-filter__chev span{display:block;transform:translateY(-1px)}
.boc-filter__body{transition:max-height .28s ease, opacity .20s ease}
.boc-filter.is-collapsed .boc-filter__body{max-height:0;opacity:0;overflow:hidden}
.boc-filter.is-collapsed .boc-filter__head[aria-expanded="false"] .boc-filter__chev span{transform:rotate(-180deg)}

.boc-actions-row .boc-btn-secondary{background: rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#e6edf3}
.boc-actions-row .boc-btn-secondary:hover{background: rgba(255,255,255,.09)}

@media (max-width: 720px){
  .boc-filter__head{padding-bottom:12px}
}
.boc-chips{display:flex;gap:8px;overflow:auto;padding-bottom:10px;margin-bottom:12px}
.boc-chips::-webkit-scrollbar{height:6px}
.boc-chip--cat{white-space:nowrap;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06)}
.boc-chip--cat.is-active{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22)}
.boc-actions--filter{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px}
.boc-toggle{display:flex;gap:10px;align-items:center;font-size:13px;opacity:.9}
.boc-toggle input{width:18px;height:18px}
.boc-sort{min-width:160px}

.boc-results-meta{display:flex;justify-content:space-between;align-items:center;margin:10px 2px 6px}
.boc-count{font-size:13px;opacity:.85}

.boc-listing{position:relative;overflow:hidden}
.boc-thumb{position:relative;border-radius:16px;overflow:hidden;margin:10px 0}
.boc-thumb img{width:100%;height:auto;display:block}
.boc-thumb--placeholder{background:linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.03));min-height:140px}
.boc-thumb__ph{height:140px}
.boc-cat{position:absolute;left:10px;bottom:10px;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.35);backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);font-size:12px;border:1px solid rgba(255,255,255,.14)}
.boc-verified{background:rgba(46, 204, 113, .18);border-color:rgba(46, 204, 113, .28)}
.boc-gold .boc-pkg{background:rgba(241,196,15,.16);border-color:rgba(241,196,15,.26)}
.boc-silver .boc-pkg{background:rgba(189,195,199,.14);border-color:rgba(189,195,199,.22)}

/* Ribbon for Gold (placed over the photo so it never collides with the title/badges) */
.boc-gold:before{display:none;}
.boc-gold .boc-thumb:before{
  content:"PREPORUČENO";
  position:absolute;
  top:12px;
  right:-44px;
  transform:rotate(35deg);
  background:rgba(241,196,15,.20);
  border:1px solid rgba(241,196,15,.30);
  color:rgba(255,255,255,.95);
  font-weight:800;
  font-size:10px;
  letter-spacing:.6px;
  padding:6px 60px;
  z-index:3;
  pointer-events:none;
}

/* Skeleton loading */
.boc-skel .boc-skel-block{height:140px;border-radius:16px;background:rgba(255,255,255,.10)}
.boc-skel-line{height:10px;border-radius:999px;background:rgba(255,255,255,.10);margin:8px 0}
.boc-skel-line--title{height:14px;width:60%}
.boc-skel-pill{display:inline-block;width:64px;height:22px;border-radius:999px;background:rgba(255,255,255,.10);margin-right:6px}
.boc-skel .boc-skel-line,.boc-skel .boc-skel-pill,.boc-skel .boc-skel-block{
  animation: bocPulse 1.2s ease-in-out infinite;
}
@keyframes bocPulse{0%{opacity:.55}50%{opacity:.95}100%{opacity:.55}}

/* Modal polish */
.boc-modal__panel{border:1px solid rgba(255,255,255,.10);background:rgba(10,10,10,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.boc-action{border-radius:14px}


/* Near me */
.boc-toggle--near{margin-left:10px}
.boc-radius{display:none;min-width:92px;max-width:110px;padding:10px 12px;border-radius:14px}
.boc-near-on .boc-radius{display:inline-block}
@media (max-width: 520px){
  .boc-toggle--near{margin-left:0}
  .boc-radius{min-width:86px}
}