/**
 * Matériel monnaie (euros) — styles des pièces et billets
 * (styles communs dans public/css/materiel-commun.css)
 */

/* Pièces : cuivre (1c, 2c, 5c), or (10c, 20c, 50c), bimétal (1€, 2€) */

.mn-piece.mo-coin {
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    box-shadow:
        inset 0 0 0 3px rgba(255, 255, 255, 0.25),
        0 2px 4px rgba(0, 0, 0, 0.2);
}

.mo-c1,
.mo-c2,
.mo-c5 {
    background: radial-gradient(circle at 35% 30%, #d99a6c, #b87333 70%);
    border: 2px solid #8f5a28;
    color: #5c3a17;
}

.mo-c1 {
    width: 42px;
    height: 42px;
    font-size: 0.7rem;
}
.mo-c2 {
    width: 48px;
    height: 48px;
    font-size: 0.75rem;
}
.mo-c5 {
    width: 54px;
    height: 54px;
    font-size: 0.8rem;
}

.mo-c10,
.mo-c20,
.mo-c50 {
    background: radial-gradient(circle at 35% 30%, #f2d16b, #d4a017 70%);
    border: 2px solid #a87c12;
    color: #6b4f0a;
}

.mo-c10 {
    width: 50px;
    height: 50px;
    font-size: 0.8rem;
}
.mo-c20 {
    width: 56px;
    height: 56px;
    font-size: 0.85rem;
}
.mo-c50 {
    width: 62px;
    height: 62px;
    font-size: 0.9rem;
}

/* 1 € : centre argenté, couronne dorée — 2 € : centre doré, couronne argentée */
.mo-e1 {
    width: 60px;
    height: 60px;
    font-size: 0.95rem;
    background: radial-gradient(circle at 35% 30%, #e8e8e8, #bdbdbd 62%, #d4a017 66%, #c29414);
    border: 2px solid #a87c12;
    color: #444;
}

.mo-e2 {
    width: 66px;
    height: 66px;
    font-size: 1rem;
    background: radial-gradient(circle at 35% 30%, #f2d16b, #d4a017 62%, #c4c4c4 66%, #adadad);
    border: 2px solid #8d8d8d;
    color: #6b4f0a;
}

/* Billets : couleurs des vraies coupures */

.mn-piece.mo-note {
    width: 170px;
    height: 90px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.5rem;
    color: rgba(0, 0, 0, 0.65);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    background-image: linear-gradient(
        105deg,
        rgba(255, 255, 255, 0.35) 0%,
        rgba(255, 255, 255, 0) 40%
    );
}

.mo-b5 {
    background-color: #b4bdb4;
    border: 2px solid #7d8a7d;
}
.mo-b10 {
    background-color: #e8a09a;
    border: 2px solid #b96860;
}
.mo-b20 {
    background-color: #9ec5e8;
    border: 2px solid #5f8fbf;
}
.mo-b50 {
    background-color: #f5c26b;
    border: 2px solid #c78f2f;
}
.mo-b100 {
    background-color: #a8d8a8;
    border: 2px solid #6aa86a;
}

/* Swatches de la palette */

.mo-swatch-coin {
    border-radius: 50%;
    display: inline-block;
}

.mo-swatch-cuivre {
    background: #b87333;
    border: 2px solid #8f5a28;
}
.mo-swatch-or {
    background: #d4a017;
    border: 2px solid #a87c12;
}
.mo-swatch-e1 {
    background: radial-gradient(circle, #bdbdbd 55%, #d4a017 60%);
    border: 2px solid #a87c12;
}
.mo-swatch-e2 {
    background: radial-gradient(circle, #d4a017 55%, #c4c4c4 60%);
    border: 2px solid #8d8d8d;
}

.mo-swatch-note {
    display: inline-block;
    width: 34px;
    height: 18px;
    border-radius: 3px;
}

.mo-swatch-b5 {
    background: #b4bdb4;
    border: 2px solid #7d8a7d;
}
.mo-swatch-b10 {
    background: #e8a09a;
    border: 2px solid #b96860;
}
.mo-swatch-b20 {
    background: #9ec5e8;
    border: 2px solid #5f8fbf;
}
.mo-swatch-b50 {
    background: #f5c26b;
    border: 2px solid #c78f2f;
}
.mo-swatch-b100 {
    background: #a8d8a8;
    border: 2px solid #6aa86a;
}