/* veliko.info – общ стил за страниците с уеб камери (мобилни първо) */
:root{--bg:#eef1f5;--card:#fff;--ink:#1b2430;--muted:#5d6b7a;--line:#cfd7e1;--accent:#0b6bcb;--accent-ink:#fff;--player:#0d1117}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0d1117;--card:#1c2632;--ink:#e6edf3;--muted:#a3b0bd;--line:#3b4a5c;--accent:#4aa3ff;--accent-ink:#06121f}}
:root[data-theme=dark]{--bg:#0d1117;--card:#1c2632;--ink:#e6edf3;--muted:#a3b0bd;--line:#3b4a5c;--accent:#4aa3ff;--accent-ink:#06121f}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--accent)}
.wrap{max-width:960px;margin:0 auto;padding:0 12px}
.top{background:var(--card);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px}
.logo{font-weight:800;text-decoration:none;color:var(--ink);font-size:18px}
.logo b{color:var(--accent)}
.top nav a{text-decoration:none;font-size:15px;margin-left:14px}
.crumbs{font-size:13px;color:var(--muted);margin:12px 0 4px}
.crumbs a{color:var(--muted)}
h1{font-size:clamp(22px,5.5vw,32px);line-height:1.2;margin:4px 0 6px}
.lead{color:var(--muted);margin:0 0 12px;font-size:15px}
/* плейър: целия екран по ширина на телефон */
.cam-player{position:relative;aspect-ratio:16/9;background:var(--player);border-radius:10px;overflow:hidden}
.cam-player iframe,.cam-player img{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain}
@media (max-width:600px){.cam-player{margin:0 -12px;border-radius:0}}
.cam-empty,.cam-link{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#cfd8e3;padding:16px;height:100%}
.cam-link{position:absolute;inset:0}
.cam-btn{display:inline-block;background:var(--accent);color:var(--accent-ink);text-decoration:none;font-weight:700;padding:12px 18px;border-radius:999px;margin-top:6px}
.cam-meta{font-size:14px;color:var(--muted);margin:8px 0}
.cam-tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.cam-tab{flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:10px 14px;font:inherit;font-size:15px;cursor:pointer;min-height:44px}
.cam-tab[aria-selected=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}
.cam-note{font-size:13px;color:var(--muted);margin:2px 0}
.cam-msg{padding:20px;background:var(--card);border-radius:10px}
/* реклами – запазено място, за да не "скача" страницата */
.ad{margin:18px 0;min-height:280px;text-align:center}
.ad::before{content:"Реклама";display:block;font-size:11px;color:var(--muted);letter-spacing:.05em}
@media (min-width:768px){.ad{min-height:120px}}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:16px 0}
.card h2{font-size:20px;margin:0 0 8px;line-height:1.3}
.card p{margin:0 0 10px}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:0;padding:0;list-style:none}
.facts li{background:var(--bg);border-radius:8px;padding:8px 10px;font-size:14px}
.facts b{display:block;font-size:16px}
details{border-top:1px solid var(--line);padding:10px 0}
details:first-of-type{border-top:0}
summary{font-weight:700;cursor:pointer}
.near{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:700px){.near{grid-template-columns:repeat(4,1fr)}}
.near-card{display:block;background:var(--bg);border-radius:8px;overflow:hidden;text-decoration:none;color:var(--ink);font-weight:700}
.near-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--line)}
.near-card span{display:block;padding:8px 10px}
footer{color:var(--muted);font-size:13px;padding:20px 0 40px;text-align:center}
.cam-player video{position:absolute;inset:0;width:100%;height:100%;background:#000;object-fit:contain}
.cam-badge{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;padding:3px 8px;border-radius:999px}
.cam-off{background:var(--card);border:1px solid var(--line);border-left:4px solid #e0a100;border-radius:10px;padding:14px 16px}
.cam-off p{margin:0 0 8px}.cam-off-t{font-weight:700;font-size:17px}
.cam-near-h{font-size:18px;margin:18px 0 8px}
.near-ph{display:flex!important;align-items:center;justify-content:center;aspect-ratio:16/9;background:var(--line);font-size:28px;color:var(--muted);padding:0!important}
a.cam-tab{display:inline-flex;align-items:center;text-decoration:none}
a.cam-tab::after{content:"›";margin-left:6px;color:var(--muted)}
.cam-list{margin:0;padding-left:20px}.cam-list li{margin:4px 0}

/* по-ясни граници на картите – и в светла, и в тъмна тема */
.card{box-shadow:0 1px 3px rgba(0,0,0,.08)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .card,:root:not([data-theme=light]) .cam-off{box-shadow:0 1px 4px rgba(0,0,0,.5)}}
:root[data-theme=dark] .card,:root[data-theme=dark] .cam-off{box-shadow:0 1px 4px rgba(0,0,0,.5)}
.near-card{background:var(--card);border:1px solid var(--line);box-shadow:0 1px 3px rgba(0,0,0,.08);transition:transform .15s}
.near-card:hover{transform:translateY(-2px)}
.card .near-card{background:var(--bg)}
.cam-tab{border-color:var(--line)}
.card h3{font-size:17px;margin:12px 0 6px}

.theme-btn{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;width:38px;height:38px;font-size:18px;line-height:1;cursor:pointer;margin-left:10px;flex:0 0 auto}
.top nav{display:flex;align-items:center;flex-wrap:nowrap;overflow-x:auto}
@media (max-width:420px){.top nav a{margin-left:10px;font-size:14px}.logo{font-size:16px}}
.cam-player{border:1px solid var(--line)}@media (max-width:600px){.cam-player{border-left:0;border-right:0}}
@media (min-width:700px){.cam-tabs{flex-wrap:wrap;overflow:visible}}
.top nav a.lang{border:1px solid var(--line);border-radius:6px;padding:3px 7px;font-size:13px;font-weight:700}
:lang(en) .ad::before{content:"Advertisement"}
.more-sites{margin-top:10px;line-height:2}.more-sites a{white-space:nowrap}
/* времето сега */
.wx{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px 12px;margin:0 0 12px;font-size:15px}
.wx-i{font-size:26px;line-height:1}.wx-t{font-size:20px}.wx-d{color:var(--muted)}
.wx-src{margin-left:auto;font-size:11px;color:var(--muted)}
@media (max-width:420px){.theme-btn{width:34px;height:34px;font-size:16px;margin-left:8px}.top .wrap{gap:8px}}
.near-card{position:relative}
.wx-chip{position:absolute;top:6px;left:6px;background:rgba(0,0,0,.62);color:#fff;font-size:13px;font-weight:700;padding:2px 8px;border-radius:999px;line-height:1.5;pointer-events:none}
.live-cnt{font-size:14px;color:var(--muted);margin:-4px 0 10px}.live-cnt b{color:var(--ink)}
/* времето – винаги на един ред */
.wx{flex-wrap:nowrap;gap:8px;padding:6px 10px}
.wx-i{font-size:24px}.wx-t{font-size:19px;white-space:nowrap}
.wx-d{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}
.wx-src{flex:0 0 auto;font-size:10px;line-height:1.2;text-align:right}
/* празните рекламни места (без реклама) не оставят дупка */
.ad:has(ins[data-ad-status=unfilled]){min-height:0;margin:0}
.ad:has(ins[data-ad-status=unfilled])::before{display:none}
ins.adsbygoogle[data-ad-status=unfilled]{display:none!important}
@media (max-width:380px){.top nav a{margin-left:8px;font-size:13px}.top nav a.lang{padding:2px 5px}.theme-btn{width:32px;height:32px;margin-left:6px}.logo{font-size:15px}}
.wx-credit{margin-top:8px;font-size:12px}
.card .facts{margin:6px 0 12px}.facts li{line-height:1.35;color:var(--muted)}.facts b{color:var(--ink)}
/* цял сайт в прозореца (напр. хотел Сима) – по-висок */
.cam-player:has(iframe[data-tall]){aspect-ratio:4/5;background:#fff}
@media (min-width:700px){.cam-player:has(iframe[data-tall]){aspect-ratio:4/3}}
/* картинка с ▶ преди зареждане на чужд прозорец */
.cam-poster{position:absolute;inset:0;width:100%;height:100%;border:0;cursor:pointer;color:#fff;font:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(160deg,#1d3b5c 0%,#0d1117 70%) center/cover no-repeat}
.cam-poster::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.35)}
.cam-poster>*{position:relative}
.cam-play{width:72px;height:72px;border-radius:50%;background:rgba(255,255,255,.92);color:#0b6bcb;font-size:30px;line-height:72px;padding-left:6px;box-shadow:0 4px 18px rgba(0,0,0,.4)}
.cam-poster:hover .cam-play{transform:scale(1.06)}
.cam-poster-t{font-weight:800;font-size:18px;text-shadow:0 1px 3px #000}.cam-poster-s{font-size:14px;opacity:.9}
/* високият прозорец – само след натискане */
.cam-player:has(iframe[data-tall]){aspect-ratio:auto;height:min(80vh,620px)}

/* ===== 09.11: по-широко на компютър – камера ~830 px + колона 300 px ===== */
.crumbs{font-size:15px;font-weight:700;color:var(--ink);margin:14px 0 6px}
.crumbs a{color:var(--accent);text-decoration:none}
.col-side{display:none}
@media (min-width:1100px){
  .wrap{max-width:1184px}
  main.page{display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:30px;align-items:start}
  main.page>*:not(.col-side){grid-column:1;min-width:0}
  .col-side{display:block;grid-column:2;grid-row:1 / span 40}
  .side-in{position:sticky;top:12px}
}
.side-ad{min-height:600px;margin-bottom:14px;text-align:center}
.side-ad::before{content:"Реклама";display:block;font-size:11px;color:var(--muted)}
:lang(en) .side-ad::before{content:"Advertisement"}
.side-box{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.side-box h3{font-size:16px;margin:0 0 8px}
.side-box ul{list-style:none;margin:0;padding:0}
.side-box li a{display:block;padding:7px 8px;border-radius:6px;text-decoration:none;color:var(--ink);font-size:15px}
.side-box li a:hover{background:var(--bg)}
.side-box li.on a{background:var(--accent);color:var(--accent-ink);font-weight:700}
/* „Още камери …“ */
.more-list{display:flex;flex-wrap:wrap;gap:8px}
.more-chip{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:8px 12px;text-decoration:none;color:var(--ink);font-weight:600;font-size:15px}
.more-chip small{color:var(--muted);font-weight:400}
.more-chip:hover{border-color:var(--accent)}
/* по-големи снимки на началната страница и категориите */
@media (min-width:700px){main:not(.page) .near{grid-template-columns:repeat(3,1fr);gap:14px}}
main:not(.page) .near-card span{font-size:17px}
/* заместител без снимка: цветна картинка според вида */
.near-ph{flex-direction:column;gap:4px;color:#fff!important;font-size:34px}
.near-ph i{font-style:normal;line-height:1}
.near-ph em{font-style:normal;font-size:13px;font-weight:700;opacity:.9}
.near-ph.k-mountain{background:linear-gradient(160deg,#6aa7e8 0%,#2e6b4e 100%)}
.near-ph.k-sea{background:linear-gradient(160deg,#7cc8f0 0%,#0b5e8a 100%)}
.near-ph.k-city{background:linear-gradient(160deg,#9fb2c8 0%,#3d4a5c 100%)}
.near-ph.k-world{background:linear-gradient(160deg,#8d9ee6 0%,#2b3570 100%)}
.near-ph i{font-size:42px!important}
.near-ph em{font-size:13px!important}
/* банер над камерата: 728×90 на компютър, 320×100 на телефон */
.ad-top{text-align:center;margin:0 0 12px;min-height:118px}
.ad-top::before{content:"Реклама";display:block;font-size:11px;color:var(--muted);line-height:18px}
:lang(en) .ad-top::before{content:"Advertisement"}
.top-ad{width:320px;height:100px}
@media (min-width:768px){.ad-top{min-height:108px}.top-ad{width:728px;height:90px}}
/* времето като каре до банера (компютър) */
@media (min-width:1100px){
  .ad-top.with-wx{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;text-align:left}
  .ad-top.with-wx::before{position:absolute}
  .ad-top{position:relative;padding-top:18px}
  .ad-top::before{position:absolute;top:0;left:0}
  .wx-tile{flex:0 0 92px;height:90px;margin:0;padding:6px;flex-direction:column;justify-content:center;gap:2px;text-align:center}
  .wx-tile .wx-i{font-size:28px}.wx-tile .wx-t{font-size:20px}
  .wx-tile .wx-d{flex:none;font-size:11px;white-space:normal;line-height:1.2;max-height:2.4em}
}
@media (min-width:1100px){.wx-tile .wx-d{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:84px;font-size:11px}}
/* 300×250 в текста – вляво, обтичан от текста (компютър/таблет) */
.ad-float{text-align:center;margin:4px 0 14px}
.ad-float::before{content:"Реклама";display:block;font-size:11px;color:var(--muted);line-height:16px}
:lang(en) .ad-float::before{content:"Advertisement"}
@media (min-width:700px){.ad-float{float:left;width:300px;margin:4px 20px 10px 0}}
.card::after{content:"";display:table;clear:both}
@media (min-width:1100px){.col-side{align-self:stretch}}
/* началната и категориите: широк адаптивен банер на цялата ширина (970×90 / 728×90) */
@media (min-width:768px){.ad-top.wide .top-ad{display:block!important;width:100%;height:90px}}
/* карта на камерите (karta.js) */
.top nav a.map-link{font-weight:700;white-space:nowrap}
@media (max-width:480px){.top nav a.map-link span{display:none}.top nav a.map-link{font-size:18px;margin-left:0}.top nav a{margin-left:9px;font-size:14px}.theme-btn{width:32px;height:32px;margin-left:6px}}
@media (max-width:420px){.top nav a{margin-left:6px;font-size:13px}.top nav a.lang{padding:2px 4px}.theme-btn{width:30px;height:30px;margin-left:4px}.logo{font-size:14px}}
.map-cta{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px}.map-cta .cam-btn{margin:0}
.cam-btn.ghost{background:transparent;color:var(--accent);border:2px solid var(--accent);padding:10px 16px}
html.map-lock,html.map-lock body{overflow:hidden}
.map-modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center}
.map-modal.open{display:flex}
.map-win{background:var(--card);color:var(--ink);width:min(1100px,94vw);height:min(760px,88vh);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 40px rgba(0,0,0,.4)}
@media (max-width:700px){.map-win{width:100vw;height:100%;border-radius:0}}
.map-bar{display:flex;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line)}
.map-bar button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 14px;font:inherit;font-size:15px;cursor:pointer;min-height:40px}
.map-bar button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
.map-bar .map-x{margin-left:auto;border:0;font-size:20px;padding:6px 12px}
.map-el{flex:1;min-height:0;position:relative}
.map-msg{padding:24px;text-align:center;color:var(--muted)}
.map-pin span{position:absolute;transform:translate(-50%,-50%);display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 6px;border-radius:999px;background:var(--c);color:#fff;font:700 13px/1 system-ui,sans-serif;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.45);white-space:nowrap;cursor:pointer}
.map-pin.off span{background:#9aa4ae;min-width:18px;height:18px;padding:0}
.map-pop{display:flex;flex-direction:column;gap:4px;font:14px/1.35 system-ui,sans-serif}
.map-pop img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px;background:#ddd}
.map-pop small{color:#5d6b7a}
.map-pop .cam-btn{text-align:center;padding:8px 14px;margin-top:4px;color:#fff;background:#0b6bcb}
.leaflet-container a.cam-btn{color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .map-el .leaflet-tile-pane{filter:brightness(.75) contrast(1.1)}}
:root[data-theme=dark] .map-el .leaflet-tile-pane{filter:brightness(.75) contrast(1.1)}
.idx-nav a.map-chip,.map-cta a.map-chip{flex:0 0 auto;border:2px solid var(--accent);color:var(--accent);background:var(--card);border-radius:999px;padding:8px 14px;text-decoration:none;font-weight:700;white-space:nowrap}
.idx-nav a.map-chip:hover{background:var(--accent);color:var(--accent-ink)}
.idx-nav{align-items:center;scrollbar-width:thin}
@media (max-width:600px){.map-chip span{display:none}.idx-nav a{padding:8px 12px}}
.logo{display:inline-flex;align-items:center;white-space:nowrap}
.logo img{width:30px;height:30px;flex:0 0 auto;margin-right:6px}
@media (max-width:420px){.logo img{width:24px;height:24px;margin-right:4px}}
@media (max-width:380px){.logo img{display:none}}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .logo img{background:#fff;border-radius:50%;padding:2px}}
:root[data-theme=dark] .logo img{background:#fff;border-radius:50%;padding:2px}
/* начална страница, широк екран: банер 728×90 + плочка с картата до него */
@media (min-width:1100px){
  .ad-top.with-tile{display:flex;align-items:flex-end;gap:12px;text-align:left}
  .ad-top.with-tile .top-ad{flex:0 0 728px}
  .map-tile{flex:1;min-width:0;height:90px;box-sizing:border-box;display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:10px;
    background:linear-gradient(135deg,#0b3d91,#0b6bcb);color:#fff;text-decoration:none;box-shadow:0 1px 3px rgba(0,0,0,.15)}
  .map-tile:hover{filter:brightness(1.08)}
  .map-tile .mt-i{font-size:34px;line-height:1}
  .map-tile .mt-x{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
  .map-tile b{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-tile small{font-size:13px;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .map-tile .mt-b{background:#fff;color:#0b3d91;font-weight:700;border-radius:999px;padding:7px 14px;white-space:nowrap}
}
@media (min-width:1100px) and (max-width:1199px){.map-tile .mt-b{display:none}}
@media (min-width:1100px){
  .ad-top.with-ad2{display:flex;align-items:flex-end;gap:12px}
  .ad-top.with-ad2 .top-ad{flex:0 0 728px}
  .ad-top.with-ad2 .top-ad2{display:block!important;flex:1;min-width:0;height:90px}
}
.top nav a.share-btn{display:inline-flex;align-items:center;gap:5px;background:#1877f2;color:#fff;border-radius:999px;padding:5px 12px 5px 8px;font-weight:700;font-size:14px;text-decoration:none;line-height:1}
.top nav a.share-btn:hover{background:#0f63d4;color:#fff}
@media (max-width:760px){.top nav a.share-btn span{display:none}.top nav a.share-btn{padding:6px;width:30px;height:30px;box-sizing:border-box;justify-content:center}}
@media (max-width:420px){.top nav a[href="world.html"]{display:none}}