:root {
    --admin-bg: #f5f7fa;
    --admin-surface: #ffffff;
    --admin-surface-muted: #f9fafb;
    --admin-text: #1f2937;
    --admin-text-secondary: #667085;
    --admin-text-muted: #98a2b3;
    --admin-border: #e4e7ec;
    --admin-border-strong: #d0d5dd;
    --admin-primary: #2563eb;
    --admin-primary-hover: #1d4ed8;
    --admin-primary-soft: #eff6ff;
    --admin-success: #15803d;
    --admin-warning: #b45309;
    --admin-danger: #dc2626;
    --admin-info: #0e7490;
    --admin-radius-xs: 4px;
    --admin-radius-sm: 6px;
    --admin-radius-md: 8px;
    --admin-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
    --admin-shadow-md: 0 12px 30px rgba(16, 24, 40, 0.12);
    --admin-sidebar-width: 232px;
    --admin-header-height: 56px;
}

body.admin-theme,
.admin-theme {
    color: var(--admin-text);
    font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC",
        "Source Han Sans SC", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
}

body.admin-theme {
    background: var(--admin-bg);
}

.admin-theme *,
.admin-theme *::before,
.admin-theme *::after {
    box-sizing: border-box;
}

.admin-theme a {
    color: var(--admin-primary);
}

.admin-theme a:hover,
.admin-theme a:focus {
    color: var(--admin-primary-hover);
}

.admin-theme .wrapper,
.admin-theme .content-wrapper {
    background: var(--admin-bg);
}

.admin-theme .content-wrapper {
    min-height: calc(100vh - var(--admin-header-height));
}

.admin-theme .content {
    padding: 20px 24px 28px;
}

.admin-theme .main-header .navbar,
.admin-theme .main-header .logo {
    min-height: var(--admin-header-height);
    height: var(--admin-header-height);
    background: var(--admin-surface);
    border-bottom: 1px solid var(--admin-border);
    box-shadow: none;
}

.admin-theme .main-header .logo {
    width: var(--admin-sidebar-width);
    line-height: var(--admin-header-height);
    color: var(--admin-text);
    font-size: 16px;
    font-weight: 600;
    border-right: 1px solid var(--admin-border);
}

.admin-theme .main-header .logo:hover {
    background: var(--admin-surface);
}

.admin-theme .main-header .navbar {
    margin-left: var(--admin-sidebar-width);
}

.admin-theme .main-header .navbar .nav > li > a {
    color: var(--admin-text-secondary);
    height: var(--admin-header-height);
    line-height: calc(var(--admin-header-height) - 2px);
}

.admin-theme .main-header .navbar .nav > li > a:hover,
.admin-theme .main-header .navbar .nav > li > a:focus {
    background: var(--admin-surface-muted);
    color: var(--admin-primary);
}

.admin-theme .main-header .navbar .user-image {
    width: 30px;
    height: 30px;
    margin-top: -7px;
}

.admin-theme .main-header .dropdown-menu {
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
    box-shadow: var(--admin-shadow-md);
    overflow: hidden;
}

.admin-theme .main-sidebar,
.admin-theme .left-side {
    width: var(--admin-sidebar-width);
    padding-top: var(--admin-header-height);
    background: var(--admin-surface);
    border-right: 1px solid var(--admin-border);
    box-shadow: none;
}

.admin-theme .content-wrapper,
.admin-theme .main-footer {
    margin-left: var(--admin-sidebar-width);
}

.admin-theme .control-sidebar,
.admin-theme .control-sidebar-bg {
    display: none !important;
}

.admin-theme .sidebar {
    padding-bottom: 20px;
}

.admin-theme .sidebar .user-panel {
    padding: 14px 16px;
    margin: 0;
}

.admin-theme .sidebar .user-panel > .image img {
    width: 38px;
    height: 38px;
    border: 2px solid var(--admin-primary-soft);
}

.admin-theme .sidebar .user-panel > .info {
    padding-left: 50px;
    left: 0;
}

.admin-theme .sidebar .user-panel > .info > p {
    color: var(--admin-text);
    font-weight: 600;
    margin-bottom: 2px;
}

.admin-theme .sidebar .user-panel > .info > a {
    color: var(--admin-text-secondary);
    font-size: 12px;
}

.admin-theme .sidebar-form {
    margin: 4px 12px 12px;
}

.admin-theme .sidebar-form input[type="text"] {
    height: 36px;
    padding: 8px 12px;
    color: var(--admin-text);
    background: var(--admin-surface-muted);
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-sm) 0 0 var(--admin-radius-sm);
    box-shadow: none;
}

.admin-theme .sidebar-form .btn {
    height: 36px;
    color: var(--admin-text-secondary);
    background: var(--admin-surface-muted);
    border: 1px solid var(--admin-border);
    border-left: 0;
    border-radius: 0 var(--admin-radius-sm) var(--admin-radius-sm) 0;
    box-shadow: none;
}

.admin-theme .sidebar-menu > li.header {
    padding: 12px 16px 6px;
    color: var(--admin-text-muted);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
}

.admin-theme .sidebar-menu > li > a {
    min-height: 42px;
    padding: 11px 14px;
    color: var(--admin-text-secondary);
    font-weight: 500;
    border-left: 3px solid transparent;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

.admin-theme .sidebar-menu > li:hover > a {
    color: var(--admin-primary);
    background: var(--admin-surface-muted);
}

.admin-theme .sidebar-menu > li.active > a,
.admin-theme .sidebar-menu > li.menu-open > a {
    color: var(--admin-primary);
    background: var(--admin-primary-soft);
    border-left-color: var(--admin-primary);
}

.admin-theme .sidebar-menu > li > .treeview-menu {
    background: var(--admin-surface-muted);
}

.admin-theme .sidebar-menu > li > .treeview-menu > li > a {
    padding: 9px 14px 9px 42px;
    color: var(--admin-text-secondary);
}

.admin-theme .sidebar-menu > li > .treeview-menu > li.active > a,
.admin-theme .sidebar-menu > li > .treeview-menu > li > a:hover {
    color: var(--admin-primary);
    background: var(--admin-primary-soft);
}

.admin-theme .content-header {
    padding: 18px 24px 7px;
}

.admin-theme .content-header > h1 {
    color: var(--admin-text);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
}

.admin-theme .content-header > .breadcrumb {
    top: 18px;
    padding: 0;
    background: transparent;
}

.admin-theme .content-header > .breadcrumb > li {
    color: var(--admin-text-muted);
}

.admin-theme .box,
.admin-theme .layui-card,
.admin-theme .nav-tabs-custom {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
    box-shadow: var(--admin-shadow-sm);
}

.admin-theme .box {
    border-top: 1px solid var(--admin-border) !important;
}

.admin-theme .box-header,
.admin-theme .layui-card-header {
    min-height: 48px;
    padding: 13px 18px;
    color: var(--admin-text);
    border-bottom: 1px solid var(--admin-border);
}

.admin-theme .box-title,
.admin-theme .layui-card-header {
    color: var(--admin-text);
    font-size: 16px;
    font-weight: 600;
}

.admin-theme .box-body,
.admin-theme .layui-card-body {
    padding: 18px;
}

.admin-theme .box-footer {
    padding: 14px 18px;
    background: var(--admin-surface);
    border-top: 1px solid var(--admin-border);
}

.admin-theme .small-box {
    min-height: 118px;
    color: var(--admin-text) !important;
    background: var(--admin-surface) !important;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
    box-shadow: var(--admin-shadow-sm);
    overflow: hidden;
}

.admin-theme .small-box:hover {
    border-color: var(--admin-border-strong);
    box-shadow: 0 4px 14px rgba(16, 24, 40, 0.07);
}

.admin-theme .small-box .inner {
    padding: 16px 18px;
}

.admin-theme .small-box .inner h3 {
    margin: 0 0 5px;
    color: var(--admin-text);
    font-size: 28px;
    font-weight: 600;
    line-height: 1.2;
}

.admin-theme .small-box .inner p {
    color: var(--admin-text-secondary);
    font-size: 13px;
}

.admin-theme .small-box .icon {
    top: 18px;
    right: 16px;
    color: var(--admin-primary) !important;
    opacity: 0.12;
}

.admin-theme .small-box.bg-green .icon {
    color: var(--admin-success) !important;
}

.admin-theme .small-box.bg-yellow .icon,
.admin-theme .small-box.bg-orange .icon {
    color: var(--admin-warning) !important;
}

.admin-theme .small-box.bg-red .icon,
.admin-theme .small-box.bg-maroon .icon {
    color: var(--admin-danger) !important;
}

.admin-theme .small-box.bg-aqua .icon,
.admin-theme .small-box.bg-blue .icon,
.admin-theme .small-box.bg-navy .icon,
.admin-theme .small-box.bg-teal .icon {
    color: var(--admin-info) !important;
}

.admin-theme .small-box > .small-box-footer {
    padding: 9px 14px;
    color: var(--admin-primary);
    background: var(--admin-surface-muted);
    border-top: 1px solid var(--admin-border);
    font-weight: 500;
}

.admin-theme .small-box > .small-box-footer:hover {
    color: var(--admin-primary-hover);
    background: var(--admin-primary-soft);
}

.admin-theme .btn,
.admin-theme .layui-btn {
    min-height: 32px;
    padding: 6px 14px;
    border: 1px solid transparent;
    border-radius: var(--admin-radius-sm);
    box-shadow: none;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: color 0.15s ease, background-color 0.15s ease,
        border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-theme .btn-xs,
.admin-theme .layui-btn-xs {
    min-height: 26px;
    height: 26px;
    padding: 3px 8px;
    font-size: 12px;
    line-height: 18px;
}

.admin-theme .btn-sm,
.admin-theme .layui-btn-sm {
    min-height: 30px;
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
}

.admin-theme .btn-primary,
.admin-theme .layui-btn-normal {
    color: #fff;
    background: var(--admin-primary);
    border-color: var(--admin-primary);
}

.admin-theme .btn-primary:hover,
.admin-theme .btn-primary:focus,
.admin-theme .layui-btn-normal:hover,
.admin-theme .layui-btn-normal:focus {
    color: #fff;
    background: var(--admin-primary-hover);
    border-color: var(--admin-primary-hover);
}

.admin-theme .btn-success {
    color: #fff;
    background: var(--admin-success);
    border-color: var(--admin-success);
}

.admin-theme .btn-info {
    color: #fff;
    background: var(--admin-info);
    border-color: var(--admin-info);
}

.admin-theme .btn-warning,
.admin-theme .layui-btn-warm {
    color: #fff;
    background: var(--admin-warning);
    border-color: var(--admin-warning);
}

.admin-theme .btn-danger,
.admin-theme .layui-btn-danger {
    color: #fff;
    background: var(--admin-danger);
    border-color: var(--admin-danger);
}

.admin-theme .btn-default,
.admin-theme .layui-btn-primary {
    color: var(--admin-text-secondary);
    background: var(--admin-surface);
    border-color: var(--admin-border-strong);
}

.admin-theme .btn-default:hover,
.admin-theme .btn-default:focus,
.admin-theme .layui-btn-primary:hover,
.admin-theme .layui-btn-primary:focus {
    color: var(--admin-primary);
    background: var(--admin-primary-soft);
    border-color: var(--admin-primary);
}

.admin-theme .btn.disabled,
.admin-theme .btn[disabled],
.admin-theme .layui-btn-disabled {
    color: var(--admin-text-muted) !important;
    background: var(--admin-surface-muted) !important;
    border-color: var(--admin-border) !important;
    opacity: 1;
}

.admin-theme .form-control,
.admin-theme .layui-input,
.admin-theme .layui-textarea {
    min-height: 36px;
    padding: 7px 11px;
    color: var(--admin-text);
    background: var(--admin-surface);
    border: 1px solid var(--admin-border-strong);
    border-radius: var(--admin-radius-sm);
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-theme .form-control:focus,
.admin-theme .layui-input:focus,
.admin-theme .layui-textarea:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.admin-theme .form-control[disabled],
.admin-theme .form-control[readonly],
.admin-theme .layui-disabled {
    color: var(--admin-text-muted) !important;
    background: var(--admin-surface-muted) !important;
}

.admin-theme .select2-container--default .select2-selection--single,
.admin-theme .select2-container--default .select2-selection--multiple {
    min-height: 36px;
    border: 1px solid var(--admin-border-strong);
    border-radius: var(--admin-radius-sm);
    box-shadow: none;
}

.admin-theme .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 34px;
}

.admin-theme .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 34px;
}

.admin-theme .input-group-addon {
    color: var(--admin-text-secondary);
    background: var(--admin-surface-muted);
    border-color: var(--admin-border-strong);
}

.admin-theme .help-block {
    margin-top: 5px;
    color: var(--admin-text-muted);
    font-size: 12px;
}

.admin-theme .form-control.error,
.admin-theme .layui-input.error,
.admin-theme .layui-textarea.error {
    border-color: var(--admin-danger);
}

.admin-theme .dataForm > .box-footer {
    position: sticky;
    bottom: 0;
    z-index: 5;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
}

.admin-theme .form-horizontal .control-label,
.admin-theme .layui-form-label {
    color: var(--admin-text-secondary);
    font-weight: 500;
}

.admin-theme .layui-form-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.admin-theme .layui-input-block {
    min-width: 0;
}

.admin-theme .table-responsive {
    border-radius: var(--admin-radius-sm);
    overflow-x: auto;
    overflow-y: hidden;
}

.admin-theme .table {
    margin-bottom: 0;
    background: var(--admin-surface);
}

.admin-theme .table > thead > tr > th {
    height: 44px;
    padding: 11px 10px;
    color: var(--admin-text-secondary);
    background: var(--admin-surface-muted);
    border-bottom: 1px solid var(--admin-border);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.admin-theme .table > tbody > tr > td {
    height: 52px;
    padding: 10px;
    color: var(--admin-text);
    border-top: 1px solid var(--admin-border);
    font-size: 13px;
    vertical-align: middle;
}

.admin-theme .table > tbody > tr:hover {
    background: var(--admin-surface-muted);
}

.admin-theme .table-responsive > .table > tbody > tr > td:not(.td-do) {
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-theme .table-responsive > .table > tbody > tr > td.td-do {
    white-space: nowrap;
}

.admin-theme .table-responsive .table td img,
.admin-theme .layui-table-cell img {
    width: 40px;
    height: 40px;
    max-width: 40px;
    max-height: 40px;
    object-fit: cover;
    border-radius: var(--admin-radius-xs);
}

.admin-theme .layui-table-view {
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
    overflow: hidden;
}

.admin-theme .layui-table-header th {
    height: 44px;
    color: var(--admin-text-secondary);
    background: var(--admin-surface-muted);
    font-weight: 600;
}

.admin-theme .layui-table-cell {
    height: auto !important;
    min-height: 40px;
    padding: 10px 12px !important;
    line-height: 20px !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.admin-theme .layui-table-cell > div,
.admin-theme .layui-table-cell > p {
    max-width: 100%;
    margin-bottom: 0;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.admin-theme .layui-table-cell .layui-btn + .layui-btn {
    margin-left: 4px;
}

.admin-theme .layui-table-body {
    scrollbar-width: thin;
}

.admin-theme .layui-table-page {
    padding: 12px 14px;
    border-top: 1px solid var(--admin-border);
}

.admin-theme .layui-laypage .layui-laypage-curr .layui-laypage-em {
    background: var(--admin-primary);
}

.admin-theme .nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: var(--admin-primary);
}

.admin-theme .nav-tabs-custom > .nav-tabs > li > a {
    color: var(--admin-text-secondary);
    border-radius: var(--admin-radius-sm) var(--admin-radius-sm) 0 0;
}

.admin-theme .nav-tabs-custom > .nav-tabs > li.active > a {
    color: var(--admin-primary);
    font-weight: 600;
}

.admin-theme .label,
.admin-theme .layui-badge {
    padding: 3px 7px;
    border-radius: var(--admin-radius-xs);
    font-size: 12px;
    font-weight: 500;
}

.admin-theme .label-success,
.admin-theme .layui-bg-green {
    color: #166534;
    background: #dcfce7;
}

.admin-theme .label-warning,
.admin-theme .layui-bg-orange {
    color: #92400e;
    background: #fef3c7;
}

.admin-theme .label-danger,
.admin-theme .layui-bg-red {
    color: #991b1b;
    background: #fee2e2;
}

.admin-theme .label-info,
.admin-theme .layui-bg-blue,
.admin-theme .layui-bg-cyan {
    color: #1e40af;
    background: #dbeafe;
}

.admin-theme .label-default,
.admin-theme .layui-bg-gray {
    color: #475467;
    background: #f2f4f7;
}

.admin-theme .pagination > li > a,
.admin-theme .pagination > li > span {
    color: var(--admin-text-secondary);
    border-color: var(--admin-border);
}

.admin-theme .pagination > .active > a,
.admin-theme .pagination > .active > span {
    color: #fff;
    background: var(--admin-primary);
    border-color: var(--admin-primary);
}

.admin-theme .callout {
    margin: 0 0 18px;
    padding: 14px 16px;
    border-radius: var(--admin-radius-sm);
    border: 1px solid var(--admin-border);
    border-left-width: 4px;
}

.admin-theme .callout-info {
    color: #155e75;
    background: #ecfeff;
    border-left-color: var(--admin-info);
}

.admin-theme .callout-success {
    color: #166534;
    background: #f0fdf4;
    border-left-color: var(--admin-success);
}

.admin-theme .callout-danger {
    color: #991b1b;
    background: #fef2f2;
    border-left-color: var(--admin-danger);
}

.admin-theme .layui-layer {
    border-radius: var(--admin-radius-md);
    box-shadow: var(--admin-shadow-md);
    overflow: hidden;
}

.admin-theme .layui-layer-title {
    height: 48px;
    padding: 0 18px;
    color: var(--admin-text);
    background: var(--admin-surface);
    border-bottom: 1px solid var(--admin-border);
    font-size: 15px;
    font-weight: 600;
    line-height: 48px;
}

.admin-theme .layui-layer-content {
    background: var(--admin-surface);
}

.admin-theme .layui-layer-btn {
    padding: 12px 16px;
    border-top: 1px solid var(--admin-border);
}

.admin-theme .layui-layer-btn .layui-layer-btn0 {
    color: #fff;
    background: var(--admin-primary);
    border-color: var(--admin-primary);
}

.admin-theme .layui-layer-btn a {
    height: 32px;
    line-height: 30px;
    border-radius: var(--admin-radius-sm);
}

.admin-order-detail-images {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 10px 0;
}

.admin-order-detail-images img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-sm);
}

.admin-theme .admin-sidebar-toggle-active {
    color: var(--admin-primary);
}

.admin-login-page {
    min-height: 100vh;
    background-color: #eef2f7;
}

.admin-login-page::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.22);
    pointer-events: none;
}

.admin-login-page .admin-login-box {
    position: relative;
    z-index: 1;
    width: 420px;
    max-width: calc(100vw - 32px);
    margin: 8vh auto 0;
}

.admin-login-page .login-logo {
    margin-bottom: 20px;
}

.admin-login-page .login-logo a {
    color: #fff;
    font-size: 26px;
    font-weight: 600;
    text-shadow: 0 2px 12px rgba(15, 23, 42, 0.2);
}

.admin-login-page .login-box-body {
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: var(--admin-radius-md);
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
}

.admin-login-page .login-box-msg {
    margin-bottom: 20px;
    color: var(--admin-text);
    font-size: 16px;
    font-weight: 600;
}

.admin-login-page .admin-login-desc {
    margin: -12px 0 20px;
    color: var(--admin-text-muted);
    font-size: 12px;
    text-align: center;
}

.admin-login-page .form-control {
    height: 42px;
}

.admin-login-page .form-control-feedback {
    top: 4px;
    right: 12px;
    color: var(--admin-text-muted);
}

.admin-login-page .admin-login-options {
    margin: 4px 0 16px;
    color: var(--admin-text-secondary);
}

.admin-login-page .admin-login-button {
    height: 42px;
    font-size: 15px;
    font-weight: 600;
}

@media (max-width: 1199px) {
    .admin-theme .content {
        padding-left: 18px;
        padding-right: 18px;
    }

    .admin-theme .layui-table-cell {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
}

@media (max-width: 991px) {
    .admin-theme .content-wrapper,
    .admin-theme .main-footer {
        margin-left: 0;
    }

    .admin-theme .main-header .navbar {
        margin-left: 0;
    }

    .admin-theme .main-header .logo {
        width: 64px;
    }

    .admin-theme .main-header .logo .logo-lg {
        display: none;
    }

    .admin-theme .main-header .logo .logo-mini {
        display: inline;
    }

    .admin-theme .main-sidebar,
    .admin-theme .left-side {
        padding-top: var(--admin-header-height);
    }

    .admin-theme.sidebar-open .content-wrapper,
    .admin-theme.sidebar-open .main-footer {
        transform: translate(var(--admin-sidebar-width), 0);
    }
}

@media (max-width: 767px) {
    .admin-theme .content,
    .admin-theme .content-header {
        padding-left: 14px;
        padding-right: 14px;
    }

    .admin-theme .box-body,
    .admin-theme .layui-card-body,
    .admin-theme .box-header,
    .admin-theme .layui-card-header {
        padding-left: 14px;
        padding-right: 14px;
    }

    .admin-theme .form-horizontal .control-label,
    .admin-theme .layui-form-label {
        width: 100%;
        min-width: 0;
        padding: 0 0 6px;
        text-align: left;
    }

    .admin-theme .form-horizontal .control-label + div[class*="col-"],
    .admin-theme .layui-input-block,
    .admin-theme .layui-input-inline {
        width: 100% !important;
        margin-left: 0;
    }

    .admin-theme .dataForm > .box-footer {
        padding: 12px 14px;
    }

    .admin-login-page .admin-login-box {
        margin-top: 24px;
    }
}