/*!
 *  WordMagic CMS: Common CSS Style v.1.0
 *  Copyright: 2019-2024 WordMagic ( https://wmcms.eu )
 */

:root {
    --bg-super-dark:    #151414;
    --bg-bright-light:  #f0f3f2;
}

/*
 *  Shadow (тінь)
 *		0px 0px — це зсуви по X та Y (тобто тінь прямо за елементом, з усіх боків)
 *		10px — розмиття (blur)
 *		0px — розтяг (spread) — тобто тільки розмита тінь, без розширення
 *		rgba(255, 255, 255, 0.2) — біла тінь, майже невидима, з прозорістю 20%
 */

.light { /* wm: Для перемикання обов'язкове */
    background-color: var(--bg-bright-light);
}
html {
    background-color: var(--primary-color);
}

/* 
 *  Alert
 */

.alert {
    display: flex;
    font-size: 14px !important;
    padding: 0.5rem 0.75rem;
    justify-content: space-between;
    align-items: center;
    min-height: 38px;
}
.alert strong {
    order: 1;
    font-weight: 400;
}
.alert .close {
    background: none !important;
    border: none;
    cursor: pointer;
    font-size: 20px;
    padding: 1px;
    margin: -1px;
    transform: translateY(0.125em) !important;
    color: inherit;
    order: 2;
}
.alert ul {
    margin: 0 !important;
    padding-left: 0;
}
.alert ul li {
    margin-left: 1.25rem;
    margin-bottom: 0;
    padding: 0;
    line-height: 1.5;
}
.alert ul li.last-error {
    margin-bottom: 0;
}

/* Світіння навколо з усіх боків */
.shadow-all {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
/*  box-shadow: 0 -1px 18px 1px rgb(32, 32, 32, 0.2); CA */
}
.shadow-all:hover {
    box-shadow: none;
}

/* Тінь знизу */
.shadow-bottom {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
/*  box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.2); Business */
/*  box-shadow: 0 7px 8px 0px rgba(32, 32, 32, 0.1); CA */
}

/* Тінь зверху */
.shadow-top {
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.15);
/*  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); Business */
}

/* Тінь праворуч */
.shadow-right {
    box-shadow: 4px 0 12px rgba(0, 0, 0, 0.15);
}

/* Тінь ліворуч */
.shadow-left {
    box-shadow: -4px 0 12px rgba(0, 0, 0, 0.15);
}

/* Тінь по діагоналі: правий нижній кут */
.shadow-bottom-right {
    box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.15);
}

/* Тінь по діагоналі: лівий нижній кут */
.shadow-bottom-left {
    box-shadow: -4px 4px 12px rgba(0, 0, 0, 0.15);
}

/* Внутрішня тінь */
.shadow-inner {
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
}

/* Неонова тінь / підсвітка */
.shadow-glow {
    box-shadow:
        0 0 8px rgba(0, 0, 0, 0.2),
        0 0 20px rgba(0, 0, 0, 0.1);
}

.widget-mt-4 {
    margin-top: 2rem !important;
}

.m-n1 {
    margin: -0.25rem !important;
}

.mt-n1,
.my-n1 {
    margin-top: -0.25rem !important;
}

.mr-n1,
.mx-n1 {
    margin-right: -0.25rem !important;
}

.mb-n1,
.my-n1 {
    margin-bottom: -0.25rem !important;
}

.ml-n1,
.mx-n1 {
    margin-left: -0.25rem !important;
}

.m-n2 {
    margin: -0.5rem !important;
}

.mt-n2,
.my-n2 {
    margin-top: -0.5rem !important;
}

.mr-n2,
.mx-n2 {
    margin-right: -0.5rem !important;
}

.mb-n2,
.my-n2 {
    margin-bottom: -0.5rem !important;
}

.ml-n2,
.mx-n2 {
    margin-left: -0.5rem !important;
}

.m-n3 {
    margin: -1rem !important;
}

.mt-n3,
.my-n3 {
    margin-top: -1rem !important;
}

.mr-n3,
.mx-n3 {
    margin-right: -1rem !important;
}

.mb-n3,
.my-n3 {
    margin-bottom: -1rem !important;
}

.ml-n3,
.mx-n3 {
    margin-left: -1rem !important;
}

.m-n4 {
    margin: -1.5rem !important;
}

.mt-n4,
.my-n4 {
    margin-top: -1.5rem !important;
}

.mr-n4,
.mx-n4 {
    margin-right: -1.5rem !important;
}

.mb-n4,
.my-n4 {
    margin-bottom: -1.5rem !important;
}

.ml-n4,
.mx-n4 {
    margin-left: -1.5rem !important;
}

.m-n5 {
    margin: -3rem !important;
}

.mt-n5,
.my-n5 {
    margin-top: -3rem !important;
}

.mr-n5,
.mx-n5 {
    margin-right: -3rem !important;
}

.mb-n5,
.my-n5 {
    margin-bottom: -3rem !important;
}

.ml-n5,
.mx-n5 {
    margin-left: -3rem !important;
}

.ml-auto, .ms-auto {
    margin-left: auto !important;
}
.mr-auto, .me-auto {
    margin-right: auto !important;
}

.text-micro {
    display: block;
    font-size: 10px !important;
    line-height: 1.1;
    transform: translateY(0.125em);
}
.text-small {
    font-size: 12px !important;
    transform: translateY(0.0625em);
}
.text-bold {
    font-weight: 800;
}

.weight-400 {
  font-weight: 400 !important;
}

.weight-500 {
  font-weight: 500 !important;
}

.weight-600 {
  font-weight: 600 !important;
}

.weight-800 {
  font-weight: 800 !important;
}

.weight-900 {
  font-weight: 900 !important;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

/**
 *  Аналог WOW-бібліотеки для функції initWowAnimations() (common.js)
 *

.reveal {
    opacity: 0;
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fadeIn.visible {
    opacity: 1;
    transform: none;
}
.fadeIn {
    transform: none;
}

.fadeInLeft {
    transform: translateX(-300px);
}
.fadeInLeft.visible {
    opacity: 1;
    transform: translateX(0);
}

.fadeInRight {
    transform: translateX(300px);
}
.fadeInRight.visible {
    opacity: 1;
    transform: translateX(0);
}

.fadeInUp {
    transform: translateY(150px);
}
.fadeInUp.visible {
    opacity: 1;
    transform: translateY(0);
}

.fadeInDown {
    transform: translateY(-150px);
}
.fadeInDown.visible {
    opacity: 1;
    transform: translateY(0);
}

.zoomIn {
    transform: scale(0.8);
}
.zoomIn.visible {
    opacity: 1;
    transform: scale(1);
} */