@use '../config/variables';

.c-targeta {
    & {
        padding: variables.$padding-contenedor-campo;

        border: variables.$border-contenedor solid variables.$border-color;
        border-radius: variables.$border-radius-contenedor;
    }

    &__titulo {
        font-size: variables.$fs-titulo-s;
    }

    &__titulo--grande {
        font-size: variables.$fs-titulo-l;
    }

    &__cantidad {
        margin: 1rem 0;

        line-height: 150px;
        font-family: variables.$font-family-numerica;
        font-size: variables.$fs-numero-m;
    }

    &__cantidad--color-azul {
        color: variables.$text-color-numero-azul;
    }

    &__cantidad--color-rojo {
        color: variables.$text-color-numero-rojo;
    }

    &__cantidad--color-verde {
        color: variables.$text-color-numero-verde;
    }

    &__cantidad--grande {
        margin: 2rem 0;

        line-height: 300px;
        font-family: variables.$font-family-numerica;
        font-size: variables.$fs-numero-l;
    }

    &__unidad-medida {
        font-size: variables.$fs-unidad-medida;
    }   
}