:root,
html.theme-1 {
    --color-theme-1: 92 57 34;
    --color-theme-2: 58 36 24;
    --color-primary: 138 94 59;
    --color-success: 22 130 95;
    --aroma-espresso: #3a2418;
    --aroma-roast: #5c3922;
    --aroma-coffee: #8a5e3b;
    --aroma-caramel: #c79462;
    --aroma-latte: #e7ddd4;
    --aroma-cream: #f5f6f7;
    --aroma-paper: #ffffff;
    --aroma-ink: #35383d;
    --aroma-shell: #edf0f2;
    --aroma-panel: #f7f8f9;
}

body {
    background: var(--aroma-shell);
    color: var(--aroma-ink);
}

.aroma-brand-logo {
    display: block;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 4px 8px rgba(58, 36, 24, 0.14));
}

.aroma-brand-logo--admin {
    height: 56px;
}

.aroma-brand-logo--mobile {
    height: 56px;
}

.aroma-brand-logo--auth {
    height: 118px;
}

.aroma-brand-link {
    z-index: 1;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    align-items: center;
    justify-content: center;
    margin: 4px 0;
    padding: 2px;
    border: 0;
    background: transparent;
}

.aroma-brand-link--mobile {
    width: 54px;
    height: 58px;
    flex-basis: 54px;
    margin: 0;
}

.aroma-brand-link .aroma-brand-logo {
    height: 52px;
    filter:
        brightness(0)
        saturate(100%)
        invert(91%)
        sepia(18%)
        saturate(404%)
        hue-rotate(344deg)
        brightness(105%)
        contrast(92%)
        drop-shadow(0 2px 4px rgba(0, 0, 0, 0.22));
}

body .enigma::before {
    background: linear-gradient(180deg, var(--aroma-roast), var(--aroma-espresso));
}

.enigma {
    background-color: var(--aroma-shell);
}

.aroma-topbar::before {
    background-color: rgba(199, 148, 98, 0.34);
}

.aroma-topbar::after {
    background:
        radial-gradient(circle at 82% -180%, rgba(199, 148, 98, 0.24), transparent 30rem),
        linear-gradient(105deg, #272421, #46342a);
    border: 1px solid rgba(255, 250, 243, 0.08);
    box-shadow: 0 14px 34px rgba(45, 27, 19, 0.28);
}

.aroma-topbar nav,
.aroma-topbar nav .text-white\/90,
.aroma-topbar [data-menu-search-mobile-toggle],
.aroma-topbar [data-tw-toggle='dropdown'] {
    color: rgba(255, 250, 243, 0.88);
}

.aroma-topbar nav {
    border-color: rgba(255, 250, 243, 0.12);
}

.aroma-topbar .search input {
    border-color: rgba(255, 250, 243, 0.1);
    background-color: rgba(255, 255, 255, 0.96);
    color: var(--aroma-ink);
}

.aroma-topbar .search input::placeholder,
.aroma-topbar .search i {
    color: #806d60;
}

body .enigma > main {
    background:
        radial-gradient(circle at 6% 0%, rgba(138, 94, 59, 0.05), transparent 28rem),
        var(--aroma-panel);
}

.top-nav .top-menu {
    color: #59636f;
}

.top-nav {
    background: var(--aroma-shell);
}

.top-nav .top-menu:hover,
.top-nav .top-menu--active {
    color: var(--aroma-coffee);
}

.enigma .top-nav > ul > li:hover > .top-menu:not(.top-menu--active) {
    background-color: rgba(255, 255, 255, 0.72);
}

.enigma .top-nav > ul > li > .top-menu.top-menu--active {
    background: transparent;
    color: var(--aroma-roast);
    box-shadow: inset 0 -2px 0 var(--aroma-caramel);
}

.enigma .top-nav > ul > li > .top-menu.top-menu--active .top-menu__icon,
.enigma .top-nav > ul > li > .top-menu.top-menu--active .top-menu__title {
    color: var(--aroma-roast);
}

.enigma .top-nav > ul > li > .top-menu.top-menu--active::after {
    display: none;
}

.top-nav > ul > li > .top-menu::before {
    background-color: var(--aroma-paper);
}

.enigma .top-nav > ul > li > ul,
.enigma .top-nav > ul > li > ul > li > ul {
    padding: 10px 12px;
    border: 1px solid #e7e9ec;
    border-radius: 12px;
    background-color: var(--aroma-paper);
    box-shadow: 0 18px 42px rgba(35, 42, 49, 0.14);
}

.enigma .top-nav > ul > li > ul > li,
.enigma .top-nav > ul > li > ul > li > ul > li {
    padding: 0;
}

.enigma .top-nav > ul > li > ul .top-menu {
    min-height: 42px;
    height: auto;
    margin: 0;
    padding: 9px 18px;
    border-radius: 7px;
}

.enigma .top-nav > ul > li > ul .top-menu .top-menu__title {
    margin-left: 14px;
}

.enigma .top-nav > ul > li > ul .top-menu:hover {
    background-color: #f5f6f7;
}

.enigma .top-nav > ul > li > ul .top-menu.top-menu--active {
    border: 0;
    background: #f1f3f5;
    color: var(--aroma-roast);
    box-shadow: none;
    font-weight: 600;
}

.enigma .top-nav > ul > li > ul .top-menu.top-menu--active::before,
.enigma .top-nav > ul > li > ul .top-menu.top-menu--active::after {
    display: none;
}

.enigma .top-nav > ul > li > ul .top-menu.top-menu--active .top-menu__icon,
.enigma .top-nav > ul > li > ul .top-menu.top-menu--active .top-menu__title {
    color: var(--aroma-roast);
}

.mobile-menu {
    background: linear-gradient(110deg, var(--aroma-roast), var(--aroma-espresso));
}

.mobile-menu .scrollable {
    background:
        radial-gradient(circle at top left, rgba(199, 148, 98, 0.2), transparent 18rem),
        linear-gradient(180deg, var(--aroma-roast), var(--aroma-espresso));
}

.box,
.intro-y.box {
    border: 1px solid #e3e7eb;
    background-color: #ffffff;
    box-shadow: 0 8px 22px rgba(35, 42, 49, 0.05);
}

table.dataTable tbody td {
    border: 0 !important;
    box-shadow: none !important;
}

table.dataTable tbody tr:hover td {
    background-color: #faf7f3;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--aroma-caramel);
    box-shadow: 0 0 0 3px rgba(199, 148, 98, 0.18);
}

.aroma-auth-shell {
    background-color: var(--aroma-paper);
}

.aroma-auth-shell::before {
    background-color: rgba(199, 148, 98, 0.2);
}

.aroma-auth-shell::after {
    background:
        radial-gradient(circle at 18% 12%, rgba(199, 148, 98, 0.32), transparent 25rem),
        linear-gradient(145deg, #2d1b13, var(--aroma-roast));
}

.aroma-auth-brand {
    align-self: flex-start;
    margin-top: 20px;
    margin-left: -36px;
    padding: 10px 18px;
    border: 1px solid rgba(255, 250, 243, 0.12);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 16px 32px rgba(22, 12, 8, 0.22);
}

.aroma-auth-content {
    width: min(100%, 760px);
    margin-left: -36px;
    padding-bottom: 24px;
}

.aroma-auth-illustration {
    display: block;
    width: min(86%, 680px);
    max-height: 46vh;
    margin-top: -18px;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 18px 28px rgba(22, 12, 8, 0.2));
}

.aroma-auth-illustration--dark {
    width: min(90%, 700px);
    max-height: 42vh;
    margin-top: 0;
    margin-left: 0;
    margin-bottom: 18px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    filter: none;
}

.aroma-auth-heading {
    margin-top: 0;
}

.aroma-auth-intro .text-white {
    color: var(--aroma-paper);
}

.aroma-auth-intro .text-white.text-opacity-70 {
    color: rgba(255, 250, 243, 0.7);
}

.aroma-auth-shell .btn-primary,
.aroma-auth-shell button[type='submit'] {
    border-color: var(--aroma-coffee);
    background: linear-gradient(135deg, var(--aroma-coffee), var(--aroma-roast));
    box-shadow: 0 10px 20px rgba(92, 57, 34, 0.2);
}

.aroma-auth-shell a {
    color: var(--aroma-coffee);
}

.aroma-auth-intro .text-white a {
    color: var(--aroma-paper);
}

@media (max-width: 767px) {
    .aroma-brand-logo--mobile {
        height: 50px;
    }
}
