.bulutmedya-ad-placeholder {
  position: relative;
  display: block;
  width: 100%;
  max-width: 1260px;
  margin: clamp(16px, 3vw, 32px) auto;
  clear: both;
  color: #64748b;
  text-align: center;
}

.bulutmedya-ad-placeholder-canvas {
  display: none;
  width: 100%;
  margin-inline: auto;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  overflow: hidden;
  border: 1px dashed #b8c2cf;
  border-radius: 4px;
  background:
    linear-gradient(135deg, rgb(241 245 249 / 72%) 25%, transparent 25%) -8px 0/16px 16px,
    linear-gradient(225deg, rgb(241 245 249 / 72%) 25%, transparent 25%) -8px 0/16px 16px,
    #f8fafc;
}

.bulutmedya-ad-placeholder-title {
  color: #475569;
  font: 700 11px/1.2 Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.bulutmedya-ad-placeholder-dimensions {
  color: #94a3b8;
  font: 500 11px/1.2 Arial, sans-serif;
  letter-spacing: .04em;
}

.bulutmedya-ad-placeholder-desktop { display: flex; }
.bulutmedya-ad-placeholder-size-120x600 { max-width: 120px; aspect-ratio: 120 / 600; }
.bulutmedya-ad-placeholder-size-160x600 { max-width: 160px; aspect-ratio: 160 / 600; }
.bulutmedya-ad-placeholder-size-1920x1080 { max-width: 1920px; aspect-ratio: 1920 / 1080; }
.bulutmedya-ad-placeholder-size-300x250 { max-width: 300px; aspect-ratio: 300 / 250; }
.bulutmedya-ad-placeholder-size-300x600 { max-width: 300px; aspect-ratio: 300 / 600; }
.bulutmedya-ad-placeholder-size-320x50 { max-width: 320px; aspect-ratio: 320 / 50; }
.bulutmedya-ad-placeholder-size-320x100 { max-width: 320px; aspect-ratio: 320 / 100; }
.bulutmedya-ad-placeholder-size-320x180 { max-width: 320px; aspect-ratio: 320 / 180; }
.bulutmedya-ad-placeholder-size-336x280 { max-width: 336px; aspect-ratio: 336 / 280; }
.bulutmedya-ad-placeholder-size-400x300 { max-width: 400px; aspect-ratio: 400 / 300; }
.bulutmedya-ad-placeholder-size-640x360 { max-width: 640px; aspect-ratio: 640 / 360; }
.bulutmedya-ad-placeholder-size-728x90 { max-width: 728px; aspect-ratio: 728 / 90; }
.bulutmedya-ad-placeholder-size-970x90 { max-width: 970px; aspect-ratio: 970 / 90; }
.bulutmedya-ad-placeholder-size-970x250 { max-width: 970px; aspect-ratio: 970 / 250; }

@media (max-width: 767px) {
  .bulutmedya-ad-placeholder-desktop,
  .bulutmedya-ad-placeholder-tablet,
  .bulutmedya-ad-no-mobile { display: none !important; }
  .bulutmedya-ad-placeholder-mobile { display: flex; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .bulutmedya-ad-placeholder-desktop,
  .bulutmedya-ad-placeholder-mobile,
  .bulutmedya-ad-no-tablet { display: none !important; }
  .bulutmedya-ad-placeholder-tablet { display: flex; }
}

@media (min-width: 1024px) {
  .bulutmedya-ad-placeholder-tablet,
  .bulutmedya-ad-placeholder-mobile,
  .bulutmedya-ad-no-desktop { display: none !important; }
}
