@use "sass:map";
@use "sass:math";
@use "@twig/scss/_global" as global;
@use "@twig/scss/variables/_variables-components" as components;

$params: (
   "price-font-size": global.$font-size-larger,
);

@if global-variable-exists(c-preorders-prices, components) {
   $keys: map.keys(components.$c-preorders-prices);
   @each $name in $keys {
      @if not map.get($params, $name) {
         @warn "Neexistující proměnná '#{$name}' v komponentě '$#{component("Preorders:Prices", "class")}'.";
      }
   }

   $params: map.merge($params, components.$c-preorders-prices);
}

.#{component("Preorders:Prices", "class")} {
   display: flex;
   justify-content: space-between;
   gap: 2rem;
   text-align: right;

   strong {
      font-size: map.get($params, "price-font-size");
   }

   p {
      margin: 0;
   }

   @container (inline-size < #{global.$sm}) {
      text-align: center;
   }
}
