/* icons.css - the 7 Material Icons glyphs this site actually uses, taken from the
   real font so the shapes are exact. The full Material Icons webfont is 128 KB for
   ~2000 icons; we use seven. Same idea as flags.css.

   Markup changed from the ligature form <i class="material-icons">name</i> to
   <i class="mi mi-name"></i>: a ligature needs the font to resolve, a class does not.
   MASK, not background-image, so background-color:currentColor keeps colour
   inheritance working the way the font glyph did. That matters: the "clear" icon is
   green (#4caf50) when a field is valid and red (#f44336) under .has-danger, and a
   baked-in fill would freeze it grey. Metrics mirror the old .material-icons rule
   (font-size:17px) so nothing resizes. */

.mi {
    display: inline-block;
    width: 1em;
    height: 1em;
    font-size: 17px;
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
}

.mi-keyboard-arrow-down {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M158 329 256 231 354 329 384 299 256 171 128 299Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M158 329 256 231 354 329 384 299 256 171 128 299Z' fill='%2523000'/></g></svg>");
}

.mi-clear {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M405 375 286 256 405 137 375 107 256 226 137 107 107 137 226 256 107 375 137 405 256 286 375 405Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M405 375 286 256 405 137 375 107 256 226 137 107 107 137 226 256 107 375 137 405 256 286 375 405Z' fill='%2523000'/></g></svg>");
}

.mi-arrow-forward {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M256 427 427 256 256 85 226 115 345 235H85V277H345L226 397Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M256 427 427 256 256 85 226 115 345 235H85V277H345L226 397Z' fill='%2523000'/></g></svg>");
}

.mi-refresh {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M377 377 427 427V277H277L346 346Q308 384 256 384Q203 384 165.5 346.5Q128 309 128.0 256.0Q128 203 165.5 165.5Q203 128 256 128Q293 128 328.5 153.0Q364 178 377 213H421Q407 157 361.0 121.0Q315 85 256 85Q186 85 136.0 135.0Q86 185 86.0 256.0Q86 327 136.0 377.0Q186 427 256 427Q286 427 321.5 412.5Q357 398 377 377Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M377 377 427 427V277H277L346 346Q308 384 256 384Q203 384 165.5 346.5Q128 309 128.0 256.0Q128 203 165.5 165.5Q203 128 256 128Q293 128 328.5 153.0Q364 178 377 213H421Q407 157 361.0 121.0Q315 85 256 85Q186 85 136.0 135.0Q86 185 86.0 256.0Q86 327 136.0 377.0Q186 427 256 427Q286 427 321.5 412.5Q357 398 377 377Z' fill='%2523000'/></g></svg>");
}

.mi-check {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M192 167 418 393 448 363 192 107 73 226 103 256Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M192 167 418 393 448 363 192 107 73 226 103 256Z' fill='%2523000'/></g></svg>");
}

.mi-credit-card {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M427 341V384H85V341ZM427 128V256H85V128ZM427 427Q445 427 457.0 414.5Q469 402 469 384V128Q469 110 457.0 97.5Q445 85 427 85H85Q67 85 55.0 97.5Q43 110 43 128V384Q43 402 55.0 414.5Q67 427 85 427Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M427 341V384H85V341ZM427 128V256H85V128ZM427 427Q445 427 457.0 414.5Q469 402 469 384V128Q469 110 457.0 97.5Q445 85 427 85H85Q67 85 55.0 97.5Q43 110 43 128V384Q43 402 55.0 414.5Q67 427 85 427Z' fill='%2523000'/></g></svg>");
}

.mi-account-balance {
    -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M245 491 448 384V341H43V384ZM341 299H405V149H341ZM43 43V107H448V43ZM213 299H277V149H213ZM85 299H149V149H85Z' fill='%2523000'/></g></svg>");
            mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='scale(0.046875,-0.046875) translate(0,-512)'><path d='M245 491 448 384V341H43V384ZM341 299H405V149H341ZM43 43V107H448V43ZM213 299H277V149H213ZM85 299H149V149H85Z' fill='%2523000'/></g></svg>");
}
