/**
 * Visual skin matched to Kumo (kumo-ui.com): buttons, fields, tables,
 * date pickers, menus, and loading. Layout, markup, and form posts stay as they are.
 */

html.miz-kumo {
    --kumo-primary: #619eff;
    --kumo-primary-ring: #045ede;
    --kumo-primary-soft: rgba(97, 158, 255, 0.28);
    --kumo-danger: #ff7d75;
    --kumo-danger-ring: #da252e;
    --kumo-text: #171717;
    --kumo-muted: #737373;
    --kumo-surface: #fff;
    --kumo-field: #fff;
    --kumo-line: rgba(23, 23, 23, 0.1);
    --kumo-line-strong: rgba(23, 23, 23, 0.14);
    --kumo-hover: #f4f5f6;
    --kumo-header: #f7f7f8;
    --kumo-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    --kumo-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html.miz-kumo.miz-login:not(.miz-theme-light),
html.miz-kumo.miz-client:not(.miz-theme-light),
html.miz-kumo.miz-dashboard:not(.miz-theme-light) {
    --kumo-text: #ededed;
    --kumo-muted: #a3a3a3;
    --kumo-surface: #141414;
    --kumo-field: #0a0a0a;
    --kumo-line: rgba(255, 255, 255, 0.12);
    --kumo-line-strong: rgba(255, 255, 255, 0.16);
    --kumo-hover: #1c1c1c;
    --kumo-header: #161616;
}

html.miz-kumo .btn,
html.miz-kumo .miz-login-banner-cta,
html.miz-kumo .miz-home-btn-primary,
html.miz-kumo .miz-btn-primary {
    border-radius: 8px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.2;
    box-shadow: 0 0 0 1px var(--kumo-line), var(--kumo-shadow);
    transition: background-color 160ms var(--kumo-ease), color 160ms var(--kumo-ease), box-shadow 160ms var(--kumo-ease), transform 160ms var(--kumo-ease);
}

html.miz-kumo .miz-login-panel .btn-primary:active,
html.miz-kumo .miz-login-banner-cta:active {
    transform: scale(0.98);
}

html.miz-kumo .btn-primary,
html.miz-kumo .btn-primary:focus,
html.miz-kumo .btn-primary:active,
html.miz-kumo .miz-login-panel .logincontainer .btn-primary,
html.miz-kumo .miz-login-panel #registration .btn-primary,
html.miz-kumo.miz-client .btn-primary,
html.miz-kumo.miz-dashboard .btn-primary,
html.miz-kumo.miz-dashboard .miz-home .btn-primary,
html.miz-kumo.miz-dashboard .miz-home-btn-primary,
html.miz-kumo.miz-theme-light .btn-primary {
    background: var(--kumo-primary) !important;
    background-image: none !important;
    border: 0 !important;
    color: #fff !important;
    font-weight: 500 !important;
    box-shadow: 0 0 0 1px var(--kumo-primary-ring), var(--kumo-shadow) !important;
}

html.miz-kumo .btn-primary:hover,
html.miz-kumo .miz-login-panel .logincontainer .btn-primary:hover,
html.miz-kumo.miz-client .btn-primary:hover,
html.miz-kumo.miz-dashboard .btn-primary:hover,
html.miz-kumo.miz-dashboard .miz-home .btn-primary:hover,
html.miz-kumo.miz-dashboard .miz-home-btn-primary:hover {
    background: #4d8ef7 !important;
    color: #fff !important;
}

html.miz-kumo .btn-default,
html.miz-kumo .btn-default:focus,
html.miz-kumo .language-chooser .btn,
html.miz-kumo .language-chooser .btn-primary,
html.miz-kumo .miz-login-banner-cta,
html.miz-kumo.miz-client .btn-default,
html.miz-kumo.miz-theme-light .btn-default,
html.miz-kumo.miz-theme-light .language-chooser .btn,
html.miz-kumo.miz-theme-light .miz-login-banner-cta {
    background: var(--kumo-surface) !important;
    background-image: none !important;
    border: 0 !important;
    color: var(--kumo-text) !important;
    box-shadow: 0 0 0 1px var(--kumo-line), var(--kumo-shadow) !important;
}

html.miz-kumo .btn-default:hover,
html.miz-kumo .language-chooser .btn:hover,
html.miz-kumo .miz-login-banner-cta:hover,
html.miz-kumo.miz-theme-light .btn-default:hover,
html.miz-kumo.miz-theme-light .miz-login-banner-cta:hover {
    background: var(--kumo-hover) !important;
    color: var(--kumo-text) !important;
}

html.miz-kumo .btn-danger,
html.miz-kumo .btn-danger:focus {
    background: var(--kumo-danger) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 0 0 1px var(--kumo-danger-ring), var(--kumo-shadow) !important;
}

html.miz-kumo .btn-xs,
html.miz-kumo .btn-sm {
    border-radius: 6px;
}

html.miz-kumo .btn.is-loading,
html.miz-kumo button.is-loading {
    position: relative;
    color: transparent !important;
    pointer-events: none;
}

html.miz-kumo .btn.is-loading::after,
html.miz-kumo button.is-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 14px;
    margin: -7px 0 0 -7px;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: miz-kumo-spin 0.7s linear infinite;
}

html.miz-kumo .form-control,
html.miz-kumo select.form-control,
html.miz-kumo textarea.form-control,
html.miz-kumo .miz-login-panel .logincontainer .form-control,
html.miz-kumo .miz-login-panel .logincontainer input[type="text"],
html.miz-kumo .miz-login-panel .logincontainer input[type="password"],
html.miz-kumo .miz-login-panel .logincontainer input[type="email"] {
    border: 0 !important;
    border-radius: 8px !important;
    background: var(--kumo-field) !important;
    color: var(--kumo-text) !important;
    box-shadow: 0 0 0 1px var(--kumo-line-strong), var(--kumo-shadow) !important;
    transition: box-shadow 160ms var(--kumo-ease);
}

html.miz-kumo .form-control:focus,
html.miz-kumo .miz-login-panel .logincontainer .form-control:focus,
html.miz-kumo .miz-login-panel #registration .form-control:focus {
    border: 0 !important;
    outline: 0;
    box-shadow: 0 0 0 1px var(--kumo-primary), 0 0 0 4px var(--kumo-primary-soft) !important;
}

html.miz-kumo .checkbox input[type="checkbox"],
html.miz-kumo input[type="checkbox"],
html.miz-kumo input[type="radio"] {
    accent-color: var(--kumo-primary);
}

html.miz-kumo table.datatable,
html.miz-kumo table.table,
html.miz-kumo table.table-list,
html.miz-kumo table.dataTable {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
}

html.miz-kumo table.datatable th,
html.miz-kumo table.datatable th a,
html.miz-kumo table.datatable th a:visited,
html.miz-kumo table.table > thead > tr > th,
html.miz-kumo table.table-list thead th,
html.miz-kumo table.dataTable thead th,
html.miz-kumo .dataTables_wrapper table.table-list thead th,
html.miz-kumo .dataTables_wrapper table.table-list thead th.sorting_asc,
html.miz-kumo .dataTables_wrapper table.table-list thead th.sorting_desc {
    background: var(--kumo-header) !important;
    background-image: none !important;
    color: var(--kumo-muted) !important;
    font-size: 12px;
    font-weight: 500 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--kumo-line) !important;
    border-radius: 0 !important;
    padding: 10px 12px !important;
    text-align: inherit;
}

html.miz-kumo table.datatable td,
html.miz-kumo table.table > tbody > tr > td,
html.miz-kumo table.table-list > tbody > tr > td,
html.miz-kumo table.table-list > tbody > tr:nth-child(even) > td,
html.miz-kumo table.table-list > tbody > tr:nth-child(odd) > td,
html.miz-kumo table.dataTable tbody td,
html.miz-kumo table.dataTable.stripe tbody tr.odd > td,
html.miz-kumo table.dataTable.display tbody tr.odd > td,
html.miz-kumo table.dataTable.display tbody tr.even > td,
html.miz-kumo table.dataTable.display tbody tr > .sorting_1,
html.miz-kumo table.dataTable.order-column tbody tr > .sorting_1,
html.miz-kumo .table-striped > tbody > tr:nth-of-type(odd) > td {
    background: var(--kumo-surface) !important;
    color: var(--kumo-text) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--kumo-line) !important;
    padding: 10px 12px !important;
    transition: background-color 160ms var(--kumo-ease);
}

html.miz-kumo table.datatable tr:not(.detail-row):hover td,
html.miz-kumo table.table-hover > tbody > tr:hover > td,
html.miz-kumo table.table-list > tbody > tr:hover > td,
html.miz-kumo table.dataTable.hover tbody tr:hover > td,
html.miz-kumo table.dataTable.display tbody tr:hover > td,
html.miz-kumo table.dataTable.display tbody tr:hover > .sorting_1 {
    background: var(--kumo-hover) !important;
    color: var(--kumo-text) !important;
}

html.miz-kumo table.datatable tr.domain-pricing-row td {
    height: 43px;
}

html.miz-kumo .dataTables_wrapper .dataTables_info,
html.miz-kumo .dataTables_wrapper .dataTables_length,
html.miz-kumo .dataTables_wrapper .dataTables_filter,
html.miz-kumo .dataTables_wrapper .dataTables_paginate {
    background: transparent !important;
    color: var(--kumo-muted) !important;
    border: 0 !important;
}

html.miz-kumo .pagination > li > a,
html.miz-kumo .pagination > li > span,
html.miz-kumo .dataTables_wrapper .dataTables_paginate .pagination > li > a,
html.miz-kumo .dataTables_wrapper .dataTables_paginate .pagination > li > span {
    border: 0 !important;
    border-radius: 8px !important;
    background: var(--kumo-surface) !important;
    color: var(--kumo-text) !important;
    box-shadow: 0 0 0 1px var(--kumo-line) !important;
}

html.miz-kumo .pagination > .active > a,
html.miz-kumo .pagination > .active > span,
html.miz-kumo .pagination > .active > a:hover,
html.miz-kumo .pagination > .active > span:hover {
    background: var(--kumo-primary) !important;
    color: #fff !important;
    box-shadow: 0 0 0 1px var(--kumo-primary-ring) !important;
}

html.miz-kumo .datepicker,
html.miz-kumo .ui-datepicker,
html.miz-kumo .bootstrap-datetimepicker-widget {
    width: auto;
    padding: 8px;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--kumo-surface) !important;
    color: var(--kumo-text) !important;
    box-shadow: 0 0 0 1px var(--kumo-line), 0 16px 40px rgba(0, 0, 0, 0.16) !important;
    font-family: inherit;
}

html.miz-kumo .datepicker table,
html.miz-kumo .ui-datepicker table {
    background: transparent !important;
}

html.miz-kumo .datepicker td,
html.miz-kumo .datepicker th,
html.miz-kumo .ui-datepicker td,
html.miz-kumo .ui-datepicker th {
    border: 0 !important;
    border-radius: 8px;
    background: transparent !important;
    color: var(--kumo-text);
}

html.miz-kumo .datepicker table tr td.day:hover,
html.miz-kumo .ui-datepicker td a:hover {
    background: var(--kumo-hover) !important;
    color: var(--kumo-text) !important;
}

html.miz-kumo .datepicker table tr td.active,
html.miz-kumo .datepicker table tr td.active:hover,
html.miz-kumo .datepicker table tr td.today,
html.miz-kumo .ui-datepicker td.ui-datepicker-today a,
html.miz-kumo .ui-datepicker td a.ui-state-active {
    background: var(--kumo-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border-radius: 8px;
}

html.miz-kumo .datepicker table tr td.old,
html.miz-kumo .datepicker table tr td.new,
html.miz-kumo .ui-datepicker td.ui-datepicker-other-month {
    color: var(--kumo-muted) !important;
}

html.miz-kumo .dropdown-menu {
    border: 0;
    border-radius: 10px;
    background: var(--kumo-surface);
    box-shadow: 0 0 0 1px var(--kumo-line), 0 12px 32px rgba(0, 0, 0, 0.14);
    animation: miz-kumo-pop 180ms var(--kumo-ease);
}

html.miz-kumo .dropdown-menu > li > a:hover,
html.miz-kumo .dropdown-menu > li > a:focus {
    background: var(--kumo-hover);
    color: var(--kumo-text);
}

html.miz-kumo #fullpage-overlay {
    background: rgba(247, 247, 248, 0.72);
    backdrop-filter: blur(8px);
}

html.miz-kumo.miz-client:not(.miz-theme-light) #fullpage-overlay,
html.miz-kumo.miz-dashboard:not(.miz-theme-light) #fullpage-overlay {
    background: rgba(0, 0, 0, 0.55);
}

html.miz-kumo #fullpage-overlay .inner-wrapper img {
    width: 28px;
    height: 28px;
    animation: miz-kumo-spin 0.7s linear infinite;
}

html.miz-kumo .fa-spinner,
html.miz-kumo .fas.fa-spinner {
    color: var(--kumo-primary);
}

@keyframes miz-kumo-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes miz-kumo-pop {
    from {
        opacity: 0;
        transform: translateY(4px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html.miz-kumo .btn,
    html.miz-kumo .miz-login-banner-cta,
    html.miz-kumo table.datatable td,
    html.miz-kumo .dropdown-menu,
    html.miz-kumo #fullpage-overlay .inner-wrapper img,
    html.miz-kumo .btn.is-loading::after {
        animation: none;
        transition: none;
        transform: none;
    }
}