.admin-body { min-height: 100vh; background: #f5f7fa; color: #202b3c; }
.admin-layout { display: flex; min-height: 100vh; }
.admin-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 5; display: flex; flex-direction: column; width: 252px; padding: 27px 18px 20px; background: #111a2b; color: #fff; }
.admin-brand { padding: 0 12px 31px; font-size: 16px; }
.sidebar-caption { margin: 23px 10px 11px; color: #78859a; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.admin-nav-link { display: flex; align-items: center; gap: 12px; margin: 2px 0; padding: 11px 12px; border-radius: 9px; color: #aab4c3; font-size: 12px; font-weight: 600; transition: .15s ease; }
.admin-nav-link:hover, .admin-nav-link.active { background: rgba(255,255,255,.09); color: #fff; }
.admin-nav-link.active { box-shadow: inset 3px 0 var(--site-lime); }
.admin-nav-icon { display: inline-grid; place-items: center; width: 22px; color: var(--site-lime); font-size: 16px; }
.sidebar-bottom { margin-top: auto; }
.sidebar-help { padding: 17px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.04); }
.sidebar-help strong { font-size: 11px; }
.sidebar-help p { margin: 6px 0 12px; color: #9ba6b5; font-size: 10px; line-height: 1.6; }
.sidebar-help a { color: var(--site-lime); font-size: 10px; font-weight: 700; }
.admin-main { display: flex; flex: 1; flex-direction: column; min-width: 0; margin-left: 252px; }
.admin-topbar { display: flex; min-height: 93px; align-items: center; justify-content: space-between; padding: 18px 38px; border-bottom: 1px solid #e9edf2; background: #fff; }
.topbar-label { color: #99a2b1; font-size: 8px; font-weight: 800; letter-spacing: .15em; }
.admin-topbar h1 { margin: 4px 0 0; color: #17202e; font-size: 19px; font-weight: 750; letter-spacing: -.03em; }
.admin-user { display: flex; align-items: center; gap: 10px; }
.user-avatar { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: #e8efff; color: var(--site-blue); font-size: 13px; font-weight: 800; }
.admin-user strong, .admin-user small { display: block; }
.admin-user strong { font-size: 10px; }
.admin-user small { margin-top: 3px; color: #8e98a8; font-size: 9px; }
.admin-content { flex: 1; width: 100%; max-width: 1420px; margin: 0 auto; padding: 32px 38px; }
.admin-footer { padding: 18px 38px; color: #9aa3b1; font-size: 10px; }
.admin-footer span { margin: 0 6px; color: var(--site-blue); }
.welcome-card { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 180px; overflow: hidden; padding: 32px 40px; border-radius: 16px; background: #18263d; color: #fff; }
.welcome-card > div:first-child { position: relative; z-index: 1; }
.welcome-kicker { color: var(--site-lime); font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.welcome-card h2 { margin: 12px 0 5px; font-size: 27px; font-weight: 750; letter-spacing: -.04em; }
.welcome-card h2 span { color: var(--site-lime); font-size: 19px; }
.welcome-card p { margin: 0; color: rgba(255,255,255,.64); font-size: 12px; }
.welcome-decoration { position: absolute; right: 24%; bottom: -110px; color: rgba(255,255,255,.04); font-size: 270px; font-weight: 900; line-height: 1; }
.stat-card, .admin-card { border: 1px solid #e9edf2; border-radius: 13px; background: #fff; box-shadow: 0 3px 14px rgba(28,46,79,.025); }
.stat-card { position: relative; min-height: 175px; padding: 21px; }
.stat-icon { display: grid; place-items: center; width: 36px; height: 36px; margin-bottom: 16px; border-radius: 11px; font-size: 16px; }
.stat-blue { background: #ebf1ff; color: #3977f6; }
.stat-purple { background: #f1edff; color: #8766ea; }
.stat-orange { background: #fff2e7; color: #ee9239; }
.stat-card small { display: block; color: #788393; font-size: 10px; }
.stat-card strong { display: block; margin-top: 3px; color: #182335; font-size: 26px; font-weight: 750; }
.stat-card a { position: absolute; right: 17px; bottom: 21px; color: var(--site-blue); font-size: 9px; font-weight: 700; }
.admin-card { overflow: hidden; padding: 24px; }
.admin-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 17px; }
.admin-card-heading h3 { margin: 0 0 5px; font-size: 14px; font-weight: 750; }
.admin-card-heading p, .page-toolbar p { margin: 0; color: #8791a0; font-size: 10px; }
.admin-card .table { margin-bottom: 0; }
.admin-table thead th { padding: 12px 14px; border-bottom: 1px solid #e8ecf1; color: #9aa3af; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.admin-table tbody td { padding: 14px; border-bottom: 1px solid #f0f2f5; color: #566174; font-size: 10px; }
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table tbody td strong { display: block; color: #202b3c; font-size: 10px; font-weight: 700; }
.admin-table tbody td small { display: block; margin-top: 5px; color: #929cab; font-size: 9px; }
.admin-table td small a { color: var(--site-blue); }
.status-badge { display: inline-block; padding: 5px 8px; border-radius: 20px; font-size: 8px; font-weight: 800; white-space: nowrap; }
.status-new { background: #fff3df; color: #be7b19; }
.status-in_progress { background: #eaf1ff; color: #4670c7; }
.status-completed { background: #e7f8ef; color: #26804f; }
.status-muted { background: #f0f2f5; color: #8791a0; }
.page-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
.item-title { display: flex; align-items: center; gap: 11px; min-width: 250px; }
.item-title > div { min-width: 0; }
.item-title small { display: block; max-width: 430px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-service-icon { display: grid; flex-shrink: 0; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: #edf3ff; color: var(--site-blue); font-size: 8px; font-weight: 900; }
.project-thumb { flex-shrink: 0; width: 42px; height: 42px; border-radius: 9px; object-fit: cover; }
.project-thumb-empty { display: grid; place-items: center; background: #f0edff; color: #765bd3; font-size: 16px; font-weight: 800; }
.btn-light-danger { background: #fff0f0; color: #d84f54; }
.btn-light-danger:hover { background: #ffe1e1; color: #c43c41; }
.admin-pagination { padding-top: 17px; }
.admin-pagination .pagination { justify-content: flex-end; margin: 0; }
.admin-pagination .page-link { border: 0; border-radius: 7px; color: #657185; font-size: 10px; }
.admin-pagination .active .page-link { background: var(--site-blue); }
.blog-admin-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 14px 0; border-top: 1px solid #f0f2f5; }
.blog-admin-pagination-summary, .blog-admin-page-status { color: #687487; font-size: 13px; }
.blog-admin-pagination-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.blog-admin-page-link { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 8px 14px; border: 1px solid #e0e6ef; border-radius: 8px; background: #fff; color: #37445a; font-size: 13px; font-weight: 600; text-decoration: none; }
.blog-admin-page-link:hover { border-color: var(--site-blue); color: var(--site-blue); }
.blog-admin-page-link.is-disabled { background: #f7f8fa; color: #9aa3af; cursor: not-allowed; }
.admin-empty { display: flex; flex-direction: column; align-items: center; padding: 55px 20px; text-align: center; }
.admin-empty > span { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 14px; border-radius: 14px; background: #edf3ff; color: var(--site-blue); font-size: 20px; }
.admin-empty strong { color: #263348; font-size: 12px; }
.admin-empty p { margin: 6px 0 0; color: #929cab; font-size: 10px; }
.image-upload-preview { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 14px; padding: 12px; border: 1px solid #e5ebf3; border-radius: 10px; background: #f8faff; }
.image-upload-preview > img { width: 92px; height: 68px; border-radius: 7px; object-fit: cover; }
.image-upload-preview > span { color: #657185; font-size: 11px; font-weight: 700; }
.image-upload-preview .form-check { margin: 0 0 0 auto; }
.form-hint { margin-top: 6px; color: #8791a0; font-size: 11px; line-height: 1.5; }
.form-card { max-width: 900px; padding: 32px; }
.form-card .form-label { color: #344054; font-size: 10px; font-weight: 700; }
.form-card .form-control { border-color: #e3e8ef; border-radius: 8px; font-size: 11px; }
.form-card .form-control:focus { border-color: #9ab8ff; box-shadow: 0 0 0 .2rem rgba(57,119,246,.09); }
.form-card .form-check-label { color: #5d6879; font-size: 10px; }
.field-error { margin-top: 5px; color: #d84f54; font-size: 9px; }
.admin-nav-link { font-size: 14px; }
.sidebar-caption { font-size: 11px; }
.admin-table tbody td { font-size: 13px; }
.admin-table tbody td strong { font-size: 13px; }
.admin-table tbody td small, .admin-card-heading p, .page-toolbar p { font-size: 13px; }
.form-card .form-label, .form-card .form-control, .form-card .form-check-label { font-size: 14px; }
.admin-image-preview { display: block; width: 100%; max-width: 680px; max-height: 320px; border: 1px solid #e3e8ef; border-radius: 10px; object-fit: contain; object-position: left center; background: #f7f9fc; }
.admin-logo-preview { max-width: 320px; height: 160px; }
.partner-thumb { padding: 5px; border: 1px solid #e9edf2; background: #fff; object-fit: contain; }
.message-preview { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.status-select { min-width: 110px; font-size: 9px; }
.inbox-count { color: #8a95a5; font-size: 10px; }

.login-page { display: flex; min-height: 100vh; background: #fff; }
.login-art { position: relative; display: flex; flex: 1; flex-direction: column; justify-content: space-between; min-height: 100vh; overflow: hidden; padding: 36px 52px; background: radial-gradient(ellipse at 80% 30%, rgba(57,119,246,.3), transparent 35%), #111a2b; color: #fff; }
.login-art::after { position: absolute; right: -100px; bottom: -180px; width: 530px; height: 530px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 55px rgba(255,255,255,.025), 0 0 0 110px rgba(255,255,255,.025); content: ""; }
.login-art-copy { position: relative; z-index: 1; max-width: 550px; margin: auto 0; }
.login-art-copy h1 { margin: 20px 0; font-size: clamp(38px, 4vw, 58px); font-weight: 750; letter-spacing: -.06em; line-height: 1.1; }
.login-art-copy h1 span { color: var(--site-lime); }
.login-art-copy p { max-width: 430px; color: rgba(255,255,255,.65); font-size: 14px; line-height: 1.8; }
.login-art > small { position: relative; z-index: 1; color: rgba(255,255,255,.45); font-size: 10px; }
.login-main { position: relative; display: grid; flex: 1; place-items: center; padding: 60px; }
.login-back { position: absolute; top: 34px; left: 42px; color: #748093; font-size: 11px; font-weight: 600; }
.login-card { width: 100%; max-width: 405px; }
.login-icon { display: grid; place-items: center; width: 47px; height: 47px; margin-bottom: 28px; border-radius: 15px; background: var(--site-lime); color: var(--site-dark); font-size: 20px; font-weight: 900; }
.login-card h2 { margin: 13px 0 6px; color: #182335; font-size: 29px; font-weight: 750; letter-spacing: -.05em; }
.login-card > p { margin-bottom: 29px; color: #8993a2; font-size: 12px; }
.login-card .form-label { color: #344054; font-size: 10px; font-weight: 700; }
.login-card .form-control { border-color: #e2e7ee; border-radius: 8px; font-size: 12px; }
.login-card .form-check-label { color: #6d7889; font-size: 10px; }
.login-card .alert { font-size: 10px; }

.admin-sidebar { width: 260px; padding: 22px 15px 18px; overflow: hidden auto; border-right: 1px solid rgba(255,255,255,.045); transition: width .22s ease, padding .22s ease; }
.admin-sidebar-header { display: flex; min-height: 66px; align-items: center; justify-content: space-between; gap: 8px; padding: 0 6px 12px 9px; }
.admin-brand { min-width: 0; padding: 0; }
.admin-brand .brand-logo { width: 145px; height: 58px; transition: width .22s ease; }
.sidebar-toggle { display: grid; flex: 0 0 34px; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; background: rgba(255,255,255,.055); color: #aab7c9; transition: .18s ease; }
.sidebar-toggle:hover { border-color: rgba(54,153,255,.45); background: rgba(54,153,255,.13); color: #63adff; }
.sidebar-toggle svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; transition: transform .22s ease; }
.admin-sidebar-nav { display: flex; flex-direction: column; }
.sidebar-caption { margin: 22px 12px 9px; color: #8794a8; font-size: 10px; letter-spacing: .13em; white-space: nowrap; }
.sidebar-caption:not(:first-child) { margin-top: 27px; }
.admin-nav-link { position: relative; min-height: 49px; gap: 13px; margin: 2px 0; padding: 11px 13px; border-radius: 12px; color: #aeb9c9; font-size: 14px; font-weight: 650; white-space: nowrap; }
.admin-nav-link:hover { background: rgba(255,255,255,.055); color: #f5f8fc; }
.admin-nav-link.active { background: #263142; color: #fff; box-shadow: inset 4px 0 #3699ff; }
.admin-nav-icon { flex: 0 0 24px; width: 24px; color: #3699ff; }
.admin-nav-icon svg { display: block; width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.admin-nav-link.active .admin-nav-icon { color: #50a5ff; }
.admin-nav-label { overflow: hidden; text-overflow: ellipsis; }
.sidebar-bottom { margin-top: auto; padding-top: 24px; }
.sidebar-help { padding: 15px; border-color: rgba(255,255,255,.09); background: rgba(255,255,255,.035); }
.sidebar-help strong { font-size: 12px; }
.sidebar-help p { font-size: 11px; }
.sidebar-help a { color: #55a7ff; font-size: 11px; }
.admin-main { margin-left: 260px; transition: margin-left .22s ease; }
.admin-layout.is-collapsed .admin-sidebar { width: 82px; padding-right: 12px; padding-left: 12px; }
.admin-layout.is-collapsed .admin-main { margin-left: 82px; }
.admin-layout.is-collapsed .admin-sidebar-header { flex-direction: column; justify-content: center; gap: 10px; padding-right: 0; padding-left: 0; }
.admin-layout.is-collapsed .admin-brand .brand-logo { width: 48px; height: 44px; object-fit: cover; object-position: left center; }
.admin-layout.is-collapsed .sidebar-toggle svg { transform: rotate(180deg); }
.admin-layout.is-collapsed .sidebar-caption,
.admin-layout.is-collapsed .admin-nav-label,
.admin-layout.is-collapsed .sidebar-help { display: none; }
.admin-layout.is-collapsed .admin-nav-link { justify-content: center; padding-right: 0; padding-left: 0; }
.admin-layout.is-collapsed .admin-nav-link.active { box-shadow: inset 4px 0 #3699ff; }
.admin-layout.is-collapsed .sidebar-bottom { display: none; }
.sidebar-toggle:focus-visible, .admin-nav-link:focus-visible { outline: 2px solid #63adff; outline-offset: 3px; }

@media (max-width: 991.98px) {
    .admin-sidebar { width: 232px; }
    .admin-main { margin-left: 232px; }
    .admin-layout.is-collapsed .admin-sidebar { width: 82px; }
    .admin-layout.is-collapsed .admin-main { margin-left: 82px; }
    .admin-content { padding: 25px 22px; }
    .admin-topbar { padding: 18px 22px; }
    .admin-footer { padding: 17px 22px; }
}
@media (max-width: 767.98px) {
    .admin-layout { flex-direction: column; }
    .admin-sidebar, .admin-layout.is-collapsed .admin-sidebar { position: sticky; inset: 0 0 auto; z-index: 20; width: 100%; max-height: 100vh; padding: 8px 14px; overflow: visible; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.07); }
    .admin-sidebar-header, .admin-layout.is-collapsed .admin-sidebar-header { min-height: 49px; flex-direction: row; justify-content: space-between; padding: 0; }
    .admin-brand, .admin-layout.is-collapsed .admin-brand { justify-content: flex-start; }
    .admin-brand .brand-logo, .admin-layout.is-collapsed .admin-brand .brand-logo { width: 120px; height: 45px; object-fit: contain; }
    .sidebar-toggle { flex-basis: 38px; width: 38px; height: 38px; }
    .sidebar-toggle svg { transform: rotate(-90deg); }
    .admin-layout.is-collapsed .sidebar-toggle svg { transform: rotate(90deg); }
    .admin-layout.is-collapsed .admin-sidebar-nav { display: none; }
    .admin-sidebar-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; max-height: calc(100vh - 70px); overflow-y: auto; padding: 3px 0 10px; }
    .sidebar-caption, .admin-layout.is-collapsed .sidebar-caption { display: block; grid-column: 1 / -1; margin: 15px 4px 5px; font-size: 9px; }
    .admin-nav-link, .admin-layout.is-collapsed .admin-nav-link { min-height: 42px; justify-content: flex-start; gap: 8px; margin: 2px 0; padding: 9px 8px; font-size: 12px; white-space: normal; }
    .admin-nav-label, .admin-layout.is-collapsed .admin-nav-label { display: inline; overflow: visible; text-overflow: clip; }
    .admin-nav-icon { flex-basis: 22px; width: 22px; }
    .sidebar-bottom, .admin-layout.is-collapsed .sidebar-bottom { display: none; }
    .admin-layout.is-collapsed .admin-main, .admin-main { margin-left: 0; }
    .admin-layout.sidebar-js:not(.is-mobile-open) .admin-sidebar-nav { display: none; }
    .admin-layout.is-mobile-open .admin-sidebar-nav { display: grid; }
    .admin-layout.is-mobile-open.is-collapsed .admin-sidebar-nav { display: grid; }
    .admin-topbar { min-height: 75px; padding: 13px; }
    .admin-topbar h1 { font-size: 15px; }
    .admin-user > div, .admin-topbar .btn { display: none; }
    .admin-content { padding: 17px 12px; }
    .admin-footer { padding: 13px; font-size: 9px; }
    .welcome-card { min-height: 165px; padding: 25px 20px; }
    .welcome-card h2 { font-size: 21px; }
    .welcome-card > .btn { position: absolute; right: 17px; bottom: 16px; padding: 8px 12px !important; font-size: 9px; }
    .welcome-decoration { right: -4%; font-size: 190px; }
    .admin-card { padding: 15px; }
    .page-toolbar { align-items: flex-start; }
    .page-toolbar .btn { flex-shrink: 0; padding: 10px 12px !important; font-size: 9px; }
    .form-card { padding: 19px; }
    .login-page { display: block; }
    .login-art { display: none; }
    .login-main { min-height: 100vh; padding: 70px 25px 35px; }
    .login-back { top: 25px; left: 25px; }
}