@charset "utf-8";


/******************************************************************************/
.btn-azure { --clr-top:var(--bkclr-azure); --clr-bottom:var(--bkclr-azure); --clr-text: var(--clr-black); 
    --clr-border:white; --clr-hover:Turquoise; --clr-hover-border:DarkTurquoise; 
}
.btn-blue { --clr-top:var(--bkclr-lightblue); --clr-bottom:var(--bkclr-lightblue); --clr-text: var(--clr-black); 
    --clr-border:var(--bkclr-lightblue); --clr-hover:var(--bkclr-lightblue); --clr-hover-border:var(--clr-blue); 
}
.btn-orange { --clr-top:var(--bkclr-orange); --clr-bottom:var(--bkclr-orange); --clr-text: var(--clr-black); 
    --clr-border:white; --clr-hover:var(--bkclr-orange); --clr-hover-border:var(--clr-orange); 
}
.btn-green { --clr-top:var(--bkclr-lightgreen); --clr-bottom:var(--bkclr-lightgreen); --clr-text: var(--clr-black); 
    --clr-border:var(--bkclr-lightgreen); --clr-hover:var(--bkclr-lightgreen); --clr-hover-border:var(--clr-green); 
}
.btn-yellow { --clr-top:var(--bkclr-yellow); --clr-bottom:var(--bkclr-yellow); --clr-text: var(--clr-black); 
    --clr-border:var(--bkclr-yellow); --clr-hover:var(--bkclr-yellow); --clr-hover-border:var(--clr-yellow); 
}
.btn-midgray { --clr-top:var(--bkclr-lightestgray); --clr-bottom:var(--bkclr-lightestgray); --clr-text: var(--clr-black); 
    --clr-border:var(--bkclr-lightestgray); --clr-hover:var(--bkclr-lightestgray); --clr-hover-border:var(--clr-gray); 
}
.btn-gray { --clr-top:var(--bkclr-gray); --clr-bottom:var(--bkclr-gray); --clr-text: var(--clr-black); 
    --clr-border:var(--bkclr-gray); --clr-hover:var(--bkclr-gray); --clr-hover-border:var(--clr-gray); 
}
.btn-dark { --clr-top:var(--clr-midgray); --clr-bottom:var(--clr-midgray); --clr-text:white; 
    --clr-border:white; --clr-hover:var(--clr-darkgray); --clr-hover-border:var(--clr-darkgray); 
}
.btn-white { --clr-top:white; --clr-bottom:white; --clr-text: var(--clr-black); 
    --clr-border:var(--clr-lightgray); --clr-hover:var(--bkclr-gray); --clr-hover-border:var(--clr-gray); 
}
.btn-red { --clr-top:var(--bkclr-red); --clr-bottom:var(--bkclr-red); --clr-text: var(--clr-black); 
    --clr-border:var(--bkclr-red); --clr-hover:var(--bkclr-red); --clr-hover-border:var(--clr-red); 
}
.btn-nav { --clr-top:var(--bkclr-header); --clr-bottom:var(--bkclr-header); --clr-text: var(--clr-header); 
    --clr-border:var(--clr-header); --clr-hover:var(--bkclr-header); --clr-hover-border:var(--bkclr-header); 
}
.btn-menu { --clr-top:transparent; --clr-bottom:transparent; --clr-text: var(--clr-header); 
    --clr-border:transparent; --clr-hover:var(--bkclr-header); --clr-hover-border:var(--clr-header); 
}

.brdwhite { border-color: white !important; }
.btn-gray.brdwhite,
.btn-dark.brdwhite,
.btn-azure.brdwhite,
.btn-blue.brdwhite,
.btn-white.brdwhite,
.btn-green.brdwhite,
.btn-yellow.brdwhite { 
    --clr-border:white; 
}

.btn-blue.hotbrdwhite, .btn-yellow.hotbrdwhite, .btn-green.hotbrdwhite {
    --clr-hover-border:white; 
}

.btn-gray.brdheader,
.btn-dark.brdheader,
.btn-azure.brdheader, 
.btn-blue.brdheader,
.btn-white.brdheader,
.btn-green.brdheader,
.btn-yellow.brdheader
{ 
    border-width:2px !important; 
    --clr-border:var(--bkclr-header);
    --clr-hover-border:var(--clr-header);
}

.btn-dark.brddark 
{
    --clr-border:var(--clr-darkgray);
    --clr-hover-border:var(--clr-text);
}

.btn-gray.brddark 
{
    --clr-border:var(--clr-darkgray);
    --clr-hover-border:var(--clr-top);
}

.btn-azure.brddark { --clr-border:var(--clr-hover-border); }
.btn-azure.brdback { --clr-border:var(--clr-top); }

.btn-azure, .btn-blue, .btn-red, .btn-green, .btn-yellow, .btn-orange, 
.btn-white, .btn-gray, .btn-midgray, .btn-nav, .btn-menu, .btn-dark {
    display: inline-block; /* Строчно-блочный элемент */
    text-align: center;
    margin: auto;
    padding: 0.3rem 0.5rem; /* Поля вокруг текста */
    border-radius: 0.5rem; /* Скругляем уголки */
    border: solid 2px var(--clr-border); /**/
    background: linear-gradient(var(--clr-top), var(--clr-bottom));
    color: var(--clr-text);/**/
    line-height: 1; /**/
    cursor:pointer;
}
.btn-menu.compact, .btn-azure.compact, .btn-blue.compact, 
.btn-gray.compact, .btn-midgray.compact, .btn-dark.compact, 
.btn-orange.compact, .btn-white.compact, .btn-green.compact, .btn-yellow.compact {
    border-width: 2px; /**/
    padding: 0.15rem 0.15rem; /* Поля вокруг текста */
    border-radius: 0.3rem; /* Скругляем уголки */
}
.btn-menu.small, .btn-azure.small, .btn-blue.small, .btn-red.small, 
.btn-gray.small, .btn-midgray.small, .btn-dark.small, 
.btn-orange.small, .btn-white.small, .btn-green.small, .btn-yellow.small {
    border-width: 1px; /**/
    padding: 0.15rem 0.15rem; /* Поля вокруг текста - поменьше */
    border-radius: 0.3rem; /* Скругляем уголки - поменьше */
    font-size: smaller;/**/
}
.btn-menu { 
    padding: 0.3rem; /**/
    padding-top: 0.5rem; /**/
}
.btn-menu.big { 
    padding: 0.3rem 0.5rem; /**/
    padding-top: 0.2rem; /**/
    margin-top: -0.3rem; /**/
    font-size: 150%;
}
.btn-menu.showhot {
    background: var(--clr-hover);
    border-color: var(--clr-hover-border); 
    border-width: 1px;
}

.btn-azure:hover, .btn-blue:hover, .btn-orange:hover, .btn-green:hover, .btn-yellow:hover, .btn-red:hover, 
.btn-gray:hover, .btn-midgray:hover, .btn-white:hover, .btn-nav:hover, .btn-menu:hover, .btn-dark:hover {
    /*border: solid;/**/
    border-color: var(--clr-hover-border); /**/
    background: var(--clr-hover);
}
.btn-azure:any-link, .btn-blue:any-link, .btn-orange:any-link, .btn-green:any-link, .btn-yellow:any-link, .btn-red:any-link, 
.btn-gray:any-link, .btn-midgray:any-link, .btn-white:any-link, .btn-nav:any-link, .btn-menu:any-link, .btn-dark:any-link
{ text-decoration: none !important; } 

.btn-azure[disabled], .btn-blue[disabled], .btn-orange[disabled], .btn-green[disabled], .btn-yellow[disabled], 
.btn-gray[disabled], .btn-midgray[disabled], .btn-white[disabled], .btn-red[disabled], 
.btn-nav[disabled], .btn-menu[disabled]
{ 
    color: darkgray;
    border: 1px hidden transparent;
    background: var(--bkclr-gray);
    cursor:default;
}
.btn-nav.disabled, .btn-menu.disabled, 
.btn-white.disabled, .btn-green.disabled, .btn-red.disabled
{
    opacity: 0.5;
    border-color: transparent;
    pointer-events:none; 
    cursor:initial;
}
.btn-nav.disabled:hover, .btn-menu.disabled:hover, 
.btn-white.disabled:hover, .btn-green.disabled:hover, .btn-red.disabled:hover { _all:unset; }

a.btn-green[inactive], a.btn-gray[inactive] { 
    border: 1px hidden transparent;
    padding: 0.1rem 0.5rem; /* V H */
    color: var(--clr-black);
    font-weight:normal;
    text-decoration: none !important;
    cursor:default;
}

a.btn-blue[selected] { text-decoration: underline dashed !important; }

.ttwdbtnsel {
    color: var(--clr-black);
    background-color: var(--bkclr-lightgray);
    border-radius: 0.3rem;
    padding: 2pt 5pt;
    font-weight: 900;
}

