/*
 * Buttons!
 *
 * basics:
 */
.btn {
    display: inline-block;
    box-sizing: border-box;  
    padding: 2px 8px;
    text-align: center;
    font-size: 13px;
    text-decoration: none;
    line-height: 1.3;
    cursor: pointer;
    font-family: "MingLiU_HKSCS", "DotGothic", serif;
}
.btnstack .btn:not(:last-child) {
    margin-bottom: 6px;
}

.btn.wide {
    display: block;          
    width: 100%;
}

@media (max-width: 430px) {
    .btn {
        padding: 4px;
    }
}
.btn.disable {
    pointer-events: none;   
    cursor: default;
}
.icon {
    display: flex;
    align-items: center;    
    gap: 10px;              
    padding: 6px 12px;
}

.icon h3 {
    margin: 0;             
    font-size: 1.5em;
    font-weight: bold;
    font-family: 'PMingLiU', 'DotGothic', serif;;

}



/* shitty bar button */
.btn-bar {
    border: 1px solid #2e3d33;
    background: #2e3d33;
    color: #fcfae2;
}
.btn-bar:hover {
    background: #3c4d3f;
}
.btn-bar:active {
    transform: translateY(1px);   /* tiny press-down */
}

/*
 * Stamp button, light and dark version
 */
.btn-stamp-light {
    border: 3px double #2e3d33;
    border-radius: 4px;
    letter-spacing: 1px;

    background: #fffff0;
    color: #2e3d33;
}
.btn-stamp-light:hover {
    background: #2e3d33;
    color: #fcfae2;
    border-color: #fcfae2;
    outline: 1px solid #2e3d33;
}
.btn-stamp-dark {
    border: 3px double #fcfae2;
    border-radius: 4px;
    letter-spacing: 1px;
    outline: 1px solid #2e3d33;

    background: #2e3d33;
    color: #fcfae2;
}
.btn-stamp-dark:hover {
    background: #fffff0;
    color: #2e3d33;
    border-color: #2e3d33;
    outline: none;
}

/* doesnt change color on hover */
.btn-stamp {    
    border: 3px double #2e3d33;
    border-radius: 4px;
    letter-spacing: 1px;
    color: #2e3d33;
}


.btn.bg1 { background-color: #dfe8d8; }
.btn.bg1:hover { background-color: #c9d6bf; }
.btn.bg2 { background-color: #dde4ea; }
.btn.bg2:hover { background-color: #c5cfd8; }
.btn.bg3 { background-color: #e0ddba; }
.btn.bg3:hover { background-color: #ccc8a0; color: #3f372a; }