/**
 * Albi Mall — normalized logo frames (consistent sizing, no blur upscale).
 */

.albi-logo-frame {
  --albi-logo-frame-w: 100%;
  --albi-logo-frame-h: 100%;
  position: relative;
  display: block;
  flex-shrink: 0;
  width: var(--albi-logo-frame-w);
  height: var(--albi-logo-frame-h);
  max-width: var(--albi-logo-frame-max-w, var(--albi-logo-frame-w));
  max-height: var(--albi-logo-frame-max-h, var(--albi-logo-frame-h));
  overflow: hidden;
  box-sizing: border-box;
}

.albi-logo-frame__img {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: middle;
}

/* Fill frame — scales small logos up, large logos down (carousel, grids). */
.albi-logo-frame--fit-frame .albi-logo-frame__img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-width: 0;
  min-height: 0;
  object-fit: contain;
  object-position: center center;
}

/* Never upscale beyond native pixels (detail / hero logos). */
.albi-logo-frame--fit-native .albi-logo-frame__img {
  width: auto !important;
  height: auto !important;
  max-width: min(100%, var(--albi-logo-native-w, 9999px)) !important;
  max-height: min(100%, var(--albi-logo-native-h, 9999px)) !important;
  object-fit: contain;
  object-position: center center;
}

/* Context presets */
.albi-logo-frame--brand {
  --albi-logo-frame-w: 100%;
  --albi-logo-frame-h: 100%;
  --albi-logo-frame-max-w: 100%;
  --albi-logo-frame-max-h: 100%;
  overflow: visible;
}

.albi-logo-frame--card {
  --albi-logo-frame-w: min(88%, 200px);
  --albi-logo-frame-h: min(82%, 160px);
  --albi-logo-frame-max-w: min(88%, 200px);
  --albi-logo-frame-max-h: min(82%, 160px);
}

.albi-logo-frame--hero {
  --albi-logo-frame-w: min(320px, 72vw);
  --albi-logo-frame-h: min(160px, 32vw);
  --albi-logo-frame-max-w: min(320px, 72vw);
  --albi-logo-frame-max-h: min(160px, 32vw);
  margin-inline: auto;
}

.albi-logo-frame--ticker {
  --albi-logo-frame-w: min(120px, 18vw);
  --albi-logo-frame-h: min(56px, 10vw);
  --albi-logo-frame-max-w: var(--albi-logo-frame-w);
  --albi-logo-frame-max-h: var(--albi-logo-frame-h);
}

/* Detail widgets — outer wrapper keeps Elementor alignment controls */
.albi-shop-logo,
.albi-gastro-logo,
.albi-argetim-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
}

.albi-shop-logo .albi-logo-frame--hero,
.albi-gastro-logo .albi-logo-frame--hero,
.albi-argetim-logo .albi-logo-frame--hero {
  width: var(--albi-logo-frame-w);
  height: var(--albi-logo-frame-h);
}

/* Brands card — fixed square so absolute logos don’t collapse / crop */
.albi-brands__marquee-item,
.albi-brands .swiper-slide {
  height: var(--albi-brand-card-size, 190px);
}

.albi-brands__card {
  height: 100%;
  min-height: var(--albi-brand-card-size, 190px);
  box-sizing: border-box;
}

.albi-brands__card-inner {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: var(--albi-brand-card-size, 190px);
  box-sizing: border-box;
  overflow: visible;
}

/* Inset keeps wide wordmarks fully visible (no top/side crop). */
.albi-brands__card-inner > .albi-logo-frame--brand {
  position: absolute;
  inset: 10%;
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  overflow: visible;
}

.albi-brands__card-inner > .albi-logo-frame--brand .albi-logo-frame__img {
  opacity: 1 !important;
  filter: none !important;
}

/* List grid — logo cells become sizing containers; frames fill available space */
.albi-shop-image,
.albi-gastro-media,
.albi-argetim-image {
  container-type: size;
  container-name: albi-logo-cell;
}

/* List grid — frame inside image cell */
.albi-shop-image .albi-logo-frame--card,
.albi-gastro-media .albi-logo-frame--card,
.albi-argetim-image .albi-logo-frame--card {
  --albi-logo-frame-w: min(88cqw, 220px);
  --albi-logo-frame-h: min(80cqh, 180px);
  --albi-logo-frame-max-w: min(88cqw, 220px);
  --albi-logo-frame-max-h: min(80cqh, 180px);
  width: var(--albi-logo-frame-w);
  height: var(--albi-logo-frame-h);
  max-width: var(--albi-logo-frame-max-w);
  max-height: var(--albi-logo-frame-max-h);
  flex-shrink: 0;
}

.albi-crm-list-widget[data-albi-list-context="shops"] .albi-shop-image .albi-logo-frame--card {
  --albi-logo-frame-w: min(90cqw, 240px);
  --albi-logo-frame-h: min(86cqh, 200px);
  --albi-logo-frame-max-w: min(90cqw, 240px);
  --albi-logo-frame-max-h: min(86cqh, 200px);
}

.albi-crm-list-widget[data-albi-list-context="gastro"] .albi-gastro-media .albi-logo-frame--card,
.albi-crm-list-widget[data-albi-list-context="argetims"] .albi-argetim-image .albi-logo-frame--card {
  --albi-logo-frame-w: min(88cqw, 220px);
  --albi-logo-frame-h: min(78cqh, 170px);
  --albi-logo-frame-max-w: min(88cqw, 220px);
  --albi-logo-frame-max-h: min(78cqh, 170px);
}

/* Legacy img rules — defer to frame when present */
.albi-brands__card-inner:not(:has(.albi-logo-frame)) .albi-brands__logo,
.albi-brands__card-inner:not(:has(.albi-logo-frame)) img.albi-brands__logo {
  display: block;
  width: auto;
  height: auto;
  max-width: min(var(--albi-brand-logo-max-w, 170px), 94%);
  max-height: min(var(--albi-brand-logo-max-h, 160px), 92%);
  object-fit: contain;
  object-position: center center;
}

@media (max-width: 767px) {
  .albi-logo-frame--brand {
    --albi-logo-frame-w: 100%;
    --albi-logo-frame-h: 100%;
  }

  .albi-logo-frame--card {
    --albi-logo-frame-w: min(86%, 180px);
    --albi-logo-frame-h: min(80%, 140px);
    --albi-logo-frame-max-w: min(86%, 180px);
    --albi-logo-frame-max-h: min(80%, 140px);
  }

  .albi-shop-image .albi-logo-frame--card,
  .albi-gastro-media .albi-logo-frame--card,
  .albi-argetim-image .albi-logo-frame--card {
    --albi-logo-frame-w: min(92cqw, 200px);
    --albi-logo-frame-h: min(84cqh, 160px);
    --albi-logo-frame-max-w: min(92cqw, 200px);
    --albi-logo-frame-max-h: min(84cqh, 160px);
  }

  .albi-logo-frame--hero {
    --albi-logo-frame-w: min(260px, 84vw);
    --albi-logo-frame-h: min(130px, 36vw);
  }
}

/* Fallback when container queries are unavailable */
@supports not (width: 1cqw) {
  .albi-shop-image .albi-logo-frame--card,
  .albi-gastro-media .albi-logo-frame--card,
  .albi-argetim-image .albi-logo-frame--card {
    --albi-logo-frame-w: min(90%, 220px);
    --albi-logo-frame-h: min(84%, 180px);
    --albi-logo-frame-max-w: min(90%, 220px);
    --albi-logo-frame-max-h: min(84%, 180px);
  }

  .albi-crm-list-widget[data-albi-list-context="shops"] .albi-shop-image .albi-logo-frame--card {
    --albi-logo-frame-w: min(92%, 240px);
    --albi-logo-frame-h: min(88%, 200px);
    --albi-logo-frame-max-w: min(92%, 240px);
    --albi-logo-frame-max-h: min(88%, 200px);
  }
}