/*
 * Tailwind for the admin bundle — utilities only, NO global preflight.
 * The admin app still renders Vuetify on most pages; Tailwind's base reset
 * would fight it. Instead the preflight essentials (solid borders, ring/shadow
 * custom-property defaults) are scoped under .md-admin, the root class of the
 * Material admin layout.
 */
@tailwind components;
@tailwind utilities;

/*
 * Zero-specificity (:where) preflight: Tailwind utilities and Vuetify's own
 * component styles both outrank it, so it only fills the gaps — solid border
 * style for border utilities, ring/shadow variable defaults — without ever
 * stripping borders from Vuetify content rendered inside the shell.
 */
:where(.md-admin),
:where(.md-admin) :where(*),
:where(.md-admin) ::before,
:where(.md-admin) ::after {
    border-width: 0;
    border-style: solid;
    border-color: #e0e0e0;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(25 103 210 / 0.2);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
}

/* Browser default anchor styling — underlines under every sidebar item —
 * leaks through because the admin bundle has no global preflight. */
:where(.md-admin) :where(a) {
    color: inherit;
    text-decoration: none;
}

.md-admin {
    font-family: "Inter", sans-serif;
    -webkit-font-smoothing: antialiased;
    background-color: #f8f9fa;
    color: #202124;
}

.md-admin .material-symbols-outlined {
    font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20;
    user-select: none;
    font-size: 20px;
}

.md-admin .sidebar-item {
    position: relative;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.md-admin .sidebar-item.active {
    background-color: #e8f0fe;
    color: #1967d2;
    font-weight: 600;
}
.md-admin .sidebar-item.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 15%;
    height: 70%;
    width: 4px;
    background-color: #1967d2;
    border-radius: 0 4px 4px 0;
}

.md-admin .custom-scrollbar::-webkit-scrollbar {
    width: 4px;
}
.md-admin .custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.md-admin .custom-scrollbar::-webkit-scrollbar-thumb {
    background: #dadce0;
    border-radius: 10px;
}

.md-admin .table-row-hover:hover {
    background-color: #f8f9fa;
}

.md-admin .premium-card {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}