/**
 * Molecule: Embed Block
 *
 * Figma node: 172:12985
 *
 * Responsive iframe wrapper.
 *   video   → 16:9, koyu arka plan
 *   map     → 3:2, arka plansız
 *   default → serbest height (inline style), border
 *
 * @package Saha
 */

/* ----------------------------------------
   Container — Default (generic iframe)
   ---------------------------------------- */

.saha-embed {
    position: relative;
    width: 100%;
    overflow: hidden;
    /* Default varyantında height inline style ile gelir.
       Video ve map varyantlarında aspect-ratio override eder. */
    /* Placeholder arka plan — iframe yüklenene kadar görünür */
    background-color: #707070; /* hardcode — sadece placeholder, token yok */
    border: 1px solid var(--saha-color-border);
}

/* ----------------------------------------
   Iframe (tüm varyantlarda ortak)
   ---------------------------------------- */

.saha-embed__iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ----------------------------------------
   Video variant — 16:9
   ---------------------------------------- */

.saha-embed--video {
    aspect-ratio: 16 / 9;
    height: auto;
    background-color: var(--saha-color-bg-dark);
    border: none;
}

/* ----------------------------------------
   Map variant — 3:2
   ---------------------------------------- */

.saha-embed--map {
    aspect-ratio: 3 / 2;
    height: auto;
    background-color: transparent;
    border: none;
}

/* ----------------------------------------
   Iframe absolute fill (video + map)
   aspect-ratio kullanıldığında iframe
   container'ı doldurmalı
   ---------------------------------------- */

.saha-embed--video,
.saha-embed--map {
    position: relative;
}

.saha-embed--video .saha-embed__iframe,
.saha-embed--map .saha-embed__iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}