:root {
    --hm-ink: #172033;
    --hm-muted: #667085;
    --hm-surface: #ffffff;
    --hm-line: #e6ebf2;
    --hm-page: #f3f6fa;
    --hm-blue: #1f6feb;
    --hm-red: #c2413a;
    --hm-green: #16865a;
    --hm-teal: #0f7c86;
    --hm-navy: #17233a;
    --hm-shadow: 0 18px 45px rgba(23, 32, 51, 0.12);
}

body.hersley-login {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    color: var(--hm-ink);
    background: #0d1422;
    font-family: "Segoe UI", Arial, sans-serif;
}

.login-slideshow,
.login-slide {
    position: fixed;
    inset: 0;
}

.login-slideshow {
    z-index: -2;
    background: #0d1422;
}

.login-slide {
    opacity: 0;
    transition: opacity 900ms ease;
}

.login-slide.is-active {
    opacity: 1;
}

.login-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.92) brightness(0.64);
}

.login-slideshow::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 1;
    background: linear-gradient(120deg, rgba(8, 18, 35, 0.9), rgba(9, 35, 47, 0.72) 48%, rgba(250, 252, 255, 0.18));
}

.login-shell {
    width: min(1120px, calc(100% - 32px));
    min-height: 100vh;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 420px;
    gap: 36px;
    align-items: center;
    padding: 44px 0;
}

.login-panel {
    color: #ffffff;
    max-width: 610px;
}

.login-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 54px;
}

.login-brand img,
.login-card-logo img {
    display: block;
    object-fit: contain;
}

.login-brand img {
    width: 158px;
    height: 54px;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 8px;
}

.login-brand span,
.login-brand strong {
    display: block;
}

.login-brand span {
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
}

.login-brand strong {
    font-size: 26px;
    line-height: 1.15;
}

.login-kicker,
.dashboard-eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin: 0 0 14px;
    padding: 5px 10px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 13px;
    font-weight: 700;
}

.login-copy h1 {
    margin: 0;
    color: #ffffff;
    font-size: 46px;
    line-height: 1.08;
    font-weight: 800;
}

.login-copy p:last-child {
    max-width: 520px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 17px;
    line-height: 1.65;
}

.login-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 38px;
}

.login-highlights div {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.09);
    color: rgba(255, 255, 255, 0.86);
}

.login-highlights i {
    color: #7bdcb5;
}

.login-card {
    width: 100%;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--hm-shadow);
    backdrop-filter: blur(12px);
}

.login-card-logo {
    width: 178px;
    height: 68px;
    display: grid;
    place-items: center;
    margin: 0 auto 18px;
    border: 1px solid var(--hm-line);
    border-radius: 8px;
    background: #ffffff;
}

.login-card-logo img {
    width: 148px;
    max-height: 46px;
    height: auto;
}

.login-card h2 {
    margin: 0;
    color: var(--hm-ink);
    font-size: 28px;
    font-weight: 800;
    text-align: center;
}

.login-card-subtitle {
    margin: 8px 0 26px;
    color: var(--hm-muted);
    text-align: center;
}

.login-card label {
    display: block;
    margin: 0 0 7px;
    color: #344054;
    font-size: 13px;
    font-weight: 700;
}

.login-field {
    position: relative;
    margin-bottom: 18px;
}

.login-field i {
    position: absolute;
    top: 50%;
    left: 14px;
    color: #7a8798;
    transform: translateY(-50%);
}

.login-field .form-control {
    height: 50px;
    padding-left: 42px;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    color: var(--hm-ink);
    box-shadow: none;
}

.login-field .form-control:focus {
    border-color: var(--hm-blue);
    box-shadow: 0 0 0 4px rgba(31, 111, 235, 0.12);
}

.login-submit {
    width: 100%;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 4px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #1f6feb, #0f7c86);
    color: #ffffff;
    font-weight: 800;
    box-shadow: 0 14px 26px rgba(31, 111, 235, 0.28);
    transition: transform 160ms ease, box-shadow 160ms ease, opacity 160ms ease;
}

.login-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 30px rgba(31, 111, 235, 0.32);
}

.login-submit:disabled {
    cursor: wait;
    opacity: 0.78;
}

.login-links {
    display: flex;
    justify-content: center;
    gap: 18px;
    margin-top: 20px;
    font-size: 13px;
}

.login-links a {
    color: var(--hm-blue);
    font-weight: 700;
}

/* Login experience */
body.hersley-login {
    overflow: hidden;
    background: #eef2f5;
}

.login-layout {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    grid-template-columns: minmax(0, 1.22fr) minmax(440px, 0.78fr);
}

.login-visual {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
    background: #172e36;
}

.login-visual .login-slideshow,
.login-visual .login-slide {
    position: absolute;
    inset: 0;
}

.login-visual .login-slideshow {
    z-index: 0;
}

.login-visual .login-slide {
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 1100ms ease, transform 7000ms ease;
}

.login-visual .login-slide.is-active {
    opacity: 1;
    transform: scale(1.07);
}

.login-visual .login-slide img {
    filter: saturate(0.82) contrast(1.04);
}

.login-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(10, 30, 37, 0.34), rgba(8, 30, 37, 0.9));
}

.login-visual-inner {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(30px, 5vw, 68px);
}

.login-brand {
    gap: 16px;
    margin: 0;
}

.login-brand-mark {
    width: 152px;
    height: 52px;
    display: grid;
    place-items: center;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 6px;
    background: #061217;
    box-shadow: 0 10px 30px rgba(8, 25, 31, 0.18);
}

.login-brand-mark img,
.login-card-logo img,
.login-splash-logo {
    display: block;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.login-brand-mark img {
    width: 126px;
}

.login-brand-copy,
.login-brand-copy small,
.login-brand-copy strong {
    display: block;
}

.login-brand-copy {
    color: #ffffff;
}

.login-brand-copy small {
    margin-bottom: 3px;
    color: #a8ddd7;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.8px;
}

.login-brand-copy strong {
    font-size: 17px;
    line-height: 1.2;
}

.login-copy {
    width: min(640px, 100%);
    margin: auto 0;
    padding: 52px 0;
}

.login-copy .login-kicker {
    gap: 8px;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(7, 28, 34, 0.2);
}

.login-copy .login-kicker i {
    color: #8be0d3;
}

.login-copy h1 {
    font-size: clamp(40px, 4.1vw, 62px);
    line-height: 1.06;
}

.login-copy > h1 + p {
    max-width: 560px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, 0.8);
    font-size: 16px;
    line-height: 1.6;
}

.login-highlights {
    gap: 10px;
    margin-top: 34px;
}

.login-highlights div {
    gap: 12px;
    min-height: 68px;
    padding: 12px 14px;
    border-radius: 6px;
    background: rgba(7, 28, 34, 0.3);
    color: #ffffff;
}

.login-highlights > div > i {
    width: 34px;
    color: #87ded2;
    font-size: 20px;
    text-align: center;
}

.login-highlights span,
.login-highlights strong,
.login-highlights small {
    display: block;
}

.login-highlights strong {
    font-size: 14px;
}

.login-highlights small {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.65);
    font-size: 11px;
}

.login-visual-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: rgba(255, 255, 255, 0.64);
    font-size: 12px;
}

.login-visual-footer i {
    margin-right: 6px;
    color: #88ded2;
}

.login-auth {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px clamp(32px, 5vw, 76px) 72px;
    background: #ffffff;
}

.login-auth-inner {
    width: 100%;
    max-width: 420px;
}

.login-card-logo {
    width: 168px;
    height: 58px;
    display: grid;
    place-items: center;
    padding: 7px 10px;
    margin: 0 0 46px;
    border: 0;
    border-radius: 6px;
    background: #061217;
}

.login-card-logo img {
    width: 142px;
}

.login-heading {
    margin-bottom: 30px;
}

.login-auth-kicker {
    margin: 0 0 10px;
    color: var(--hm-teal);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.6px;
}

.login-heading h2 {
    margin: 0;
    color: var(--hm-ink);
    font-size: 32px;
    line-height: 1.2;
    font-weight: 800;
}

.login-heading > p:last-child {
    margin: 10px 0 0;
    color: var(--hm-muted);
    font-size: 14px;
    line-height: 1.55;
}

.login-auth label {
    display: block;
    margin: 0 0 8px;
    color: #344054;
    font-size: 13px;
    font-weight: 700;
}

.login-auth .login-field {
    margin-bottom: 20px;
}

.login-field > i {
    left: 17px;
    z-index: 1;
    pointer-events: none;
}

.login-auth .login-field .form-control {
    height: 54px;
    padding: 0 46px;
    border: 1px solid #d5dce5;
    border-radius: 6px;
    background: #fbfcfd;
    font-size: 14px;
    transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.login-auth .login-field .form-control::placeholder {
    color: #98a2b3;
}

.login-auth .login-field .form-control:focus {
    border-color: var(--hm-teal);
    background: #ffffff;
    box-shadow: 0 0 0 4px rgba(15, 124, 134, 0.1);
}

.login-password-toggle {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #667085;
    cursor: pointer;
    transform: translateY(-50%);
}

.login-password-toggle:hover,
.login-password-toggle:focus {
    background: #eef5f5;
    color: var(--hm-teal);
    outline: 0;
}

.login-auth .login-submit {
    height: 54px;
    justify-content: space-between;
    margin-top: 6px;
    padding: 0 20px;
    border-radius: 6px;
    background: #087f78;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 12px 28px rgba(8, 127, 120, 0.2);
    cursor: pointer;
}

.login-auth .login-submit:hover {
    background: #076c67;
    box-shadow: 0 16px 32px rgba(8, 127, 120, 0.26);
}

.login-auth .login-submit:disabled {
    opacity: 0.72;
    transform: none;
}

.login-security-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid var(--hm-line);
    color: #7a8493;
    font-size: 12px;
    line-height: 1.45;
}

.login-security-note i {
    color: var(--hm-green);
}

.login-auth-footer {
    position: absolute;
    right: 0;
    bottom: 24px;
    left: 0;
    color: #98a2b3;
    font-size: 11px;
    text-align: center;
}

.login-splash {
    position: fixed;
    inset: 0;
    z-index: 1000010;
    display: grid;
    place-items: center;
    padding: 24px;
    background: #f4f8f9;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 220ms ease, visibility 220ms ease;
}

.login-splash.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.login-splash-content {
    width: min(390px, 100%);
    text-align: center;
    transform: translateY(8px);
    transition: transform 260ms ease;
}

.login-splash.is-visible .login-splash-content {
    transform: translateY(0);
}

.login-splash-logo {
    width: 168px;
    padding: 9px 11px;
    margin: 0 auto 44px;
    border-radius: 6px;
    background: #061217;
}

.login-splash-indicator {
    position: relative;
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    margin: 0 auto 26px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--hm-teal);
    font-size: 24px;
    box-shadow: 0 12px 32px rgba(23, 32, 51, 0.11);
}

.login-splash-indicator::before {
    content: "";
    position: absolute;
    inset: -7px;
    border: 2px solid rgba(15, 124, 134, 0.16);
    border-top-color: var(--hm-teal);
    border-radius: 50%;
    animation: hm-login-spin 850ms linear infinite;
}

.login-splash.is-success .login-splash-indicator {
    background: var(--hm-green);
    color: #ffffff;
}

.login-splash.is-success .login-splash-indicator::before {
    border-color: rgba(22, 134, 90, 0.24);
    animation: none;
}

.login-splash h2 {
    margin: 0;
    color: var(--hm-ink);
    font-size: 25px;
    font-weight: 800;
}

.login-splash p {
    margin: 9px 0 24px;
    color: var(--hm-muted);
    font-size: 14px;
}

.login-splash-progress {
    width: 220px;
    height: 4px;
    margin: 0 auto 20px;
    overflow: hidden;
    border-radius: 4px;
    background: #dfe8e9;
}

.login-splash-progress span {
    display: block;
    width: 48%;
    height: 100%;
    border-radius: inherit;
    background: var(--hm-teal);
    animation: hm-login-progress 1100ms ease-in-out infinite;
}

.login-splash.is-success .login-splash-progress span {
    width: 100%;
    background: var(--hm-green);
    animation: none;
}

.login-splash small {
    color: #8a96a5;
    font-size: 11px;
}

.login-splash small i {
    margin-right: 5px;
    color: var(--hm-green);
}

body.hersley-admin {
    background: var(--hm-page);
    color: var(--hm-ink);
    font-family: "Segoe UI", Arial, sans-serif;
}

.hersley-admin .topbar,
.hersley-admin .navbar-header {
    background: #101a2d !important;
}

.hersley-admin .navbar-brand {
    min-width: 220px;
    height: 64px;
    display: flex;
    align-items: center;
    padding: 0 18px;
}

.hersley-admin .navbar-brand .logo-text {
    display: flex;
    align-items: center;
    margin: 0;
}

.hersley-header-logo {
    width: 154px;
    max-height: 48px;
    object-fit: contain;
}

.hersley-admin .left-sidebar {
    background: #132033 !important;
    box-shadow: 10px 0 34px rgba(18, 32, 51, 0.12);
}

.hersley-admin .sidebar-nav ul .sidebar-item .sidebar-link,
.hersley-admin .left-sidebar .hide-menu {
    color: rgba(255, 255, 255, 0.78) !important;
}

.hersley-admin .sidebar-nav ul .sidebar-item .sidebar-link:hover,
.hersley-admin .sidebar-nav ul .sidebar-item.selected > .sidebar-link {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
    border-radius: 8px;
}

.hersley-admin .sidebar-nav .sidebar-item i {
    color: #7bdcb5 !important;
}

.hersley-admin .page-wrapper {
    min-height: calc(100vh - 64px);
    padding: 0 !important;
    background: var(--hm-page) !important;
}

.hersley-admin .container-fluid {
    padding: 22px 24px 30px;
}

.hersley-admin .page-breadcrumb {
    padding: 14px 24px 0;
    background: var(--hm-page);
}

.hersley-admin .page-breadcrumb .btn-success,
.hersley-admin .page-breadcrumb button {
    min-height: 34px;
    border: 1px solid var(--hm-line);
    border-radius: 8px;
    background: #ffffff;
    color: var(--hm-ink);
    font-weight: 700;
    box-shadow: none;
}

.hersley-admin .breadcrumb {
    margin-bottom: 0;
    background: transparent;
}

.hersley-admin .breadcrumb-item a {
    color: var(--hm-blue);
    font-weight: 700;
}

.hersley-admin #kullaniciBilgisi {
    padding: 8px 12px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff !important;
    font-weight: 700;
}

.hersley-admin .footer {
    border-top: 1px solid var(--hm-line);
    background: #ffffff !important;
    color: var(--hm-muted) !important;
}

.dashboard-shell {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.dashboard-hero {
    min-height: 190px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 22px;
    padding: 28px;
    border-radius: 8px;
    color: #ffffff;
    background:
        linear-gradient(110deg, rgba(14, 30, 55, 0.96), rgba(16, 82, 91, 0.88)),
        url("../../assets/images/close-up-hands-typing-keyboard.jpg") center/cover;
    box-shadow: var(--hm-shadow);
}

.dashboard-hero .dashboard-eyebrow {
    border-color: rgba(255, 255, 255, 0.24);
}

.dashboard-hero h1 {
    margin: 0;
    color: #ffffff;
    font-size: 34px;
    line-height: 1.16;
    font-weight: 800;
}

.dashboard-hero p {
    max-width: 650px;
    margin: 10px 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 15px;
    line-height: 1.6;
}

.dashboard-hero-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(94px, 1fr));
    gap: 10px;
}

.dashboard-action {
    min-height: 82px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    text-align: center;
    font-weight: 800;
}

.dashboard-action:hover {
    color: #ffffff;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.17);
}

.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.metric-card,
.dashboard-panel {
    border: 1px solid var(--hm-line);
    border-radius: 8px;
    background: var(--hm-surface);
    box-shadow: 0 10px 28px rgba(23, 32, 51, 0.08);
}

.metric-card {
    position: relative;
    min-height: 158px;
    display: flex;
    flex-direction: column;
    padding: 18px;
    overflow: hidden;
    color: var(--hm-ink);
    text-decoration: none;
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.metric-card:hover {
    color: var(--hm-ink);
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: var(--hm-shadow);
}

.metric-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--accent);
}

.metric-blue { --accent: var(--hm-blue); }
.metric-red { --accent: var(--hm-red); }
.metric-green { --accent: var(--hm-green); }
.metric-teal { --accent: var(--hm-teal); }

.metric-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    border-radius: 8px;
    background: #eef5ff;
    color: var(--accent);
    font-size: 18px;
}

.metric-red .metric-icon {
    background: #fff1f0;
}

.metric-green .metric-icon {
    background: #ebf8f2;
}

.metric-teal .metric-icon {
    background: #e9f7f8;
}

.metric-label {
    color: var(--hm-muted);
    font-size: 13px;
    font-weight: 800;
}

.metric-card strong {
    margin-top: 4px;
    color: var(--hm-ink);
    font-size: 34px;
    line-height: 1;
}

.metric-card small {
    margin-top: auto;
    color: var(--hm-muted);
    font-weight: 700;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
    gap: 14px;
}

.dashboard-panel {
    padding: 20px;
}

.panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 18px;
}

.panel-header span {
    color: var(--hm-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.panel-header h2 {
    margin: 3px 0 0;
    color: var(--hm-ink);
    font-size: 20px;
    font-weight: 800;
}

.panel-header strong {
    padding: 7px 10px;
    border-radius: 8px;
    background: #eef5ff;
    color: var(--hm-blue);
    white-space: nowrap;
}

.progress-list {
    display: grid;
    gap: 18px;
}

.progress-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    color: var(--hm-ink);
    font-weight: 800;
}

.progress-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.progress-meta i {
    color: var(--hm-teal);
}

.progress-track {
    height: 10px;
    overflow: hidden;
    border-radius: 8px;
    background: #edf1f6;
}

.progress-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--hm-blue), var(--hm-teal));
}

.quick-links {
    display: grid;
    gap: 10px;
}

.quick-links-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quick-links a {
    min-height: 50px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 13px;
    border: 1px solid var(--hm-line);
    border-radius: 8px;
    color: var(--hm-ink);
    font-weight: 800;
    text-decoration: none;
}

.quick-links a:hover {
    border-color: rgba(31, 111, 235, 0.3);
    background: #f6f9fe;
    color: var(--hm-blue);
    text-decoration: none;
}

.quick-links i {
    width: 20px;
    color: var(--hm-teal);
    text-align: center;
}

.preloader,
.lds-ripple,
.lds-pos {
    display: none !important;
}

#splashScreen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999999;
    height: 3px;
    overflow: hidden;
    pointer-events: none;
    background: transparent;
    transition: opacity 220ms ease, visibility 220ms ease;
}

#splashScreen.hidden {
    opacity: 0;
    visibility: hidden;
}

.splash-progress {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 42%;
    border-radius: 0 999px 999px 0;
    background: linear-gradient(90deg, var(--hm-teal), var(--hm-blue));
    box-shadow: 0 0 18px rgba(20, 184, 166, 0.42);
    content: "";
    animation: hm-loadbar 860ms ease-in-out infinite;
}

#toast-container {
    z-index: 1000000;
}

#toast-container > .toast {
    position: relative;
    width: min(380px, calc(100vw - 28px));
    min-height: 72px;
    padding: 16px 18px 15px 58px;
    border: 1px solid rgba(23, 32, 51, 0.08);
    border-radius: 8px;
    background-image: none !important;
    background-color: #ffffff;
    color: var(--hm-ink);
    box-shadow: 0 18px 46px rgba(23, 32, 51, 0.18);
    opacity: 1;
}

#toast-container > .toast::before {
    position: absolute;
    top: 18px;
    left: 18px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: #ffffff;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome";
    font-weight: 900;
    font-size: 13px;
}

#toast-container > .toast-success {
    border-left: 4px solid var(--hm-green);
}

#toast-container > .toast-success::before {
    content: "\f00c";
    background: var(--hm-green);
}

#toast-container > .toast-error {
    border-left: 4px solid var(--hm-red);
}

#toast-container > .toast-error::before {
    content: "\f00d";
    background: var(--hm-red);
}

#toast-container > .toast-warning {
    border-left: 4px solid #d89b18;
}

#toast-container > .toast-warning::before {
    content: "\f071";
    background: #d89b18;
}

#toast-container > .toast-info {
    border-left: 4px solid var(--hm-blue);
}

#toast-container > .toast-info::before {
    content: "\f129";
    background: var(--hm-blue);
}

#toast-container .toast-title {
    color: var(--hm-ink);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
}

#toast-container .toast-message {
    margin-top: 4px;
    color: var(--hm-muted);
    font-size: 13px;
    line-height: 1.45;
}

#toast-container .toast-close-button {
    top: -4px;
    right: -4px;
    color: #98a2b3;
    text-shadow: none;
    opacity: 1;
}

#toast-container .toast-progress {
    height: 3px;
    background: rgba(23, 32, 51, 0.35);
    opacity: 1;
}

.modal-backdrop.show {
    opacity: 0.62;
}

.modal-dialog {
    max-width: min(760px, calc(100% - 26px));
}

.modal-content {
    overflow: hidden;
    border: 1px solid rgba(23, 32, 51, 0.08);
    border-radius: 8px;
    box-shadow: 0 28px 70px rgba(14, 26, 45, 0.28);
}

.modal-header {
    min-height: 64px;
    align-items: center;
    border-bottom: 1px solid var(--hm-line);
    background: linear-gradient(135deg, #f8fbff, #eef5ff);
}

.modal-title,
.modal-header h4,
.modal-header h5 {
    margin: 0;
    color: var(--hm-ink);
    font-size: 18px;
    font-weight: 800;
}

.modal-header .close {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: -4px -4px -4px auto;
    padding: 0;
    border-radius: 8px;
    color: var(--hm-muted);
    opacity: 1;
    text-shadow: none;
}

.modal-header .close:hover {
    background: rgba(31, 111, 235, 0.08);
    color: var(--hm-blue);
}

.modal-body {
    padding: 22px;
    background: #ffffff;
    color: var(--hm-ink);
}

.modal-footer {
    gap: 8px;
    padding: 16px 22px;
    border-top: 1px solid var(--hm-line);
    background: #f8fafc;
}

.modal .form-control,
.modal .custom-select,
.modal select,
.modal textarea {
    min-height: 42px;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    box-shadow: none;
}

.modal .form-control:focus,
.modal .custom-select:focus,
.modal select:focus,
.modal textarea:focus {
    border-color: var(--hm-blue);
    box-shadow: 0 0 0 4px rgba(31, 111, 235, 0.1);
}

.modal label {
    color: #344054;
    font-weight: 700;
}

.modal .btn {
    min-height: 38px;
    border-radius: 8px;
    font-weight: 800;
}

.modal .btn-primary,
.modal .btn-success {
    border-color: transparent;
    background: linear-gradient(135deg, var(--hm-blue), var(--hm-teal));
}

.modal .btn-danger {
    border-color: transparent;
    background: linear-gradient(135deg, #c2413a, #8f2d28);
}

.modal .btn-warning {
    border-color: transparent;
    background: linear-gradient(135deg, #f0b429, #d88912);
    color: #ffffff;
}

.sweet-alert,
.swal2-popup {
    border-radius: 8px !important;
    box-shadow: 0 28px 70px rgba(14, 26, 45, 0.28) !important;
}

.sweet-alert h2,
.swal2-title {
    color: var(--hm-ink) !important;
    font-weight: 800 !important;
}

.sweet-alert p,
.swal2-html-container {
    color: var(--hm-muted) !important;
}

.sweet-alert button,
.swal2-confirm,
.swal2-cancel {
    border-radius: 8px !important;
    font-weight: 800 !important;
}

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

@keyframes hm-loadbar {
    0% {
        transform: translateX(-120%);
    }

    55% {
        transform: translateX(95%);
    }

    100% {
        transform: translateX(240%);
    }
}

@keyframes hm-login-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes hm-login-progress {
    0% {
        transform: translateX(-115%);
    }

    55% {
        transform: translateX(65%);
    }

    100% {
        transform: translateX(215%);
    }
}

@media (max-width: 991.98px) {
    .login-shell,
    .dashboard-hero,
    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .login-shell {
        width: min(620px, calc(100% - 28px));
    }

    .login-panel {
        max-width: none;
    }

    .login-brand {
        margin-bottom: 28px;
    }

    .login-copy h1 {
        font-size: 36px;
    }

    .metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .login-shell {
        padding: 22px 0;
    }

    .login-panel {
        display: none;
    }

    .login-card {
        padding: 24px;
    }

    .hersley-admin .navbar-brand {
        min-width: auto;
        padding: 0 12px;
    }

    .hersley-header-logo {
        width: 132px;
    }

    .hersley-admin .container-fluid,
    .hersley-admin .page-breadcrumb {
        padding-left: 14px;
        padding-right: 14px;
    }

    .dashboard-hero {
        padding: 20px;
    }

    .dashboard-hero-actions,
    .metric-grid,
    .quick-links-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-hero h1 {
        font-size: 28px;
    }
}

@media (max-width: 1100px) {
    .login-layout {
        grid-template-columns: minmax(300px, 0.85fr) minmax(420px, 1fr);
    }

    .login-visual-inner {
        padding: 34px;
    }

    .login-copy h1 {
        font-size: 38px;
    }

    .login-highlights {
        grid-template-columns: 1fr;
        max-width: 240px;
    }

    .login-highlights div:nth-child(n+3) {
        display: none;
    }
}

@media (max-width: 767.98px) {
    body.hersley-login {
        overflow-y: auto;
    }

    .login-layout {
        display: block;
    }

    .login-visual {
        display: none;
    }

    .login-auth {
        min-height: 100vh;
        min-height: 100dvh;
        padding: 42px 28px 72px;
    }

    .login-auth-inner {
        max-width: 440px;
    }

    .login-card-logo {
        margin-bottom: 42px;
    }
}

/* Refined navigation icons */
.hm-main-nav .hm-nav-icon {
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    font-size: 15px;
}

.hm-main-nav .hm-nav-icon.hm-teal { color: #58d6c8; }
.hm-main-nav .hm-nav-icon.hm-blue { color: #82adff; }
.hm-main-nav .hm-nav-icon.hm-green { color: #6fd49e; }
.hm-main-nav .hm-nav-icon.hm-amber { color: #f2c968; }
.hm-main-nav .hm-nav-icon.hm-coral { color: #f18b78; }
.hm-main-nav .hm-nav-icon.hm-cyan { color: #62c7dd; }

/* Operations cockpit dashboard */
.op-dashboard {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.op-dashboard-header {
    min-height: 126px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 4px 2px 18px;
    border-bottom: 1px solid #dbe3ea;
}

.op-brand-block {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 16px;
}

.op-brand-logo {
    width: 82px;
    height: 82px;
    flex: 0 0 82px;
    overflow: hidden;
    border: 1px solid #dfe6ec;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 7px 18px rgba(23, 32, 51, 0.07);
}

.op-brand-logo img {
    width: 100px;
    max-width: none;
    height: 100px;
    margin: -9px;
    object-fit: cover;
}

.op-brand-copy {
    min-width: 0;
}

.op-brand-copy > span {
    display: block;
    margin-bottom: 4px;
    color: #087f78;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
}

.op-brand-copy h1 {
    margin: 0;
    color: #142236;
    font-size: 30px;
    line-height: 1.15;
    font-weight: 800;
}

.op-brand-copy p {
    margin: 8px 0 0;
    color: #556274;
    font-size: 13px;
    line-height: 1.5;
}

.op-brand-copy p strong {
    color: #1d2b3f;
}

.op-session-block {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.op-live-status {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 12px;
    border: 1px solid #cde5d8;
    border-radius: 6px;
    background: #eef9f3;
    color: #27704d;
    font-size: 11px;
    font-weight: 800;
}

.op-live-status i {
    width: 8px;
    height: 8px;
    display: block;
    border-radius: 50%;
    background: #24a365;
    box-shadow: 0 0 0 4px rgba(36, 163, 101, 0.12);
}

.op-session-date {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 11px;
    border: 1px solid #dfe6ed;
    border-radius: 6px;
    background: #ffffff;
    color: #087f78;
}

.op-session-date span,
.op-session-date small,
.op-session-date strong {
    display: block;
}

.op-session-date small {
    color: #778396 !important;
    font-size: 9px;
}

.op-session-date strong {
    color: #27364a;
    font-size: 11px;
}

.op-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.op-kpi {
    --op-color: #316fd7;
    --op-dark: #255bb8;
    min-width: 0;
    min-height: 154px;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    grid-template-rows: 1fr auto;
    align-items: center;
    gap: 13px;
    padding: 19px;
    border-radius: 7px;
    background: var(--op-color);
    color: #ffffff;
    box-shadow: 0 12px 25px color-mix(in srgb, var(--op-color) 28%, transparent);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.op-kpi:hover {
    background: var(--op-dark);
    color: #ffffff;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 16px 32px color-mix(in srgb, var(--op-color) 36%, transparent);
}

.op-kpi-blue { --op-color: #316fd7; --op-dark: #255bb8; }
.op-kpi-coral { --op-color: #d45e4a; --op-dark: #b94b39; }
.op-kpi-green { --op-color: #23875a; --op-dark: #196f48; }
.op-kpi-amber { --op-color: #bc7e12; --op-dark: #9c670c; }

.op-kpi-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.17);
    color: #ffffff;
    font-size: 17px;
}

.op-kpi-data,
.op-kpi-data small,
.op-kpi-data strong,
.op-kpi-data em {
    min-width: 0;
    display: block;
}

.op-kpi-data small {
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.op-kpi-data strong {
    margin: 3px 0;
    color: #ffffff;
    font-size: 31px;
    line-height: 1;
}

.op-kpi-data em {
    color: rgba(255, 255, 255, 0.7);
    font-size: 9px;
    font-style: normal;
}

.op-kpi-link {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 11px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
}

.op-kpi-link i {
    font-size: 9px;
}

.op-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(330px, 0.45fr);
    gap: 12px;
}

.op-panel {
    min-width: 0;
    padding: 22px;
    border: 1px solid #dfe6ed;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(23, 32, 51, 0.06);
}

.op-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 19px;
}

.op-panel-heading span,
.op-panel-heading h2,
.op-panel-heading p {
    margin: 0;
}

.op-panel-heading > div > span {
    color: #087f78;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0;
}

.op-panel-heading h2 {
    margin-top: 4px;
    color: #142236;
    font-size: 19px;
    font-weight: 800;
}

.op-panel-heading p {
    margin-top: 4px;
    color: #5d6a7c;
    font-size: 11px;
}

.op-panel-heading > strong {
    padding: 6px 9px;
    border-radius: 5px;
    background: #e8f5f3;
    color: #087f78;
    font-size: 9px;
}

.op-module-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.op-module {
    --module-color: #316fd7;
    --module-soft: #eaf1ff;
    min-width: 0;
    min-height: 78px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto 9px;
    align-items: center;
    gap: 11px;
    padding: 12px;
    border: 1px solid #e1e7ee;
    border-left: 3px solid var(--module-color);
    border-radius: 6px;
    color: #344054;
    transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
}

.op-module:hover {
    border-color: var(--module-color);
    background: var(--module-soft);
    color: #172033;
    text-decoration: none;
    transform: translateX(2px);
}

.op-module-blue { --module-color: #316fd7; --module-soft: #eef4ff; }
.op-module-coral { --module-color: #d45e4a; --module-soft: #fff0ed; }
.op-module-green { --module-color: #23875a; --module-soft: #eaf7ef; }
.op-module-teal { --module-color: #087f78; --module-soft: #e8f5f3; }
.op-module-cyan { --module-color: #17849d; --module-soft: #e9f7fa; }
.op-module-red { --module-color: #cb4949; --module-soft: #ffeded; }
.op-module-amber { --module-color: #bc7e12; --module-soft: #fff5df; }

.op-module-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--module-soft);
    color: var(--module-color);
    font-size: 15px;
}

.op-module > span,
.op-module strong,
.op-module small {
    min-width: 0;
    display: block;
}

.op-module strong {
    overflow: hidden;
    color: #253044;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.op-module small {
    margin-top: 3px;
    overflow: hidden;
    color: #647184 !important;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.op-module em {
    min-width: 28px;
    padding: 5px 6px;
    border-radius: 5px;
    background: var(--module-soft);
    color: var(--module-color);
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    text-align: center;
}

.op-module > i {
    color: #94a0af;
    font-size: 8px;
}

.op-chart-area {
    display: grid;
    place-items: center;
    padding: 5px 0 20px;
}

.op-donut {
    position: relative;
    width: 170px;
    height: 170px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(#316fd7 0 var(--op-one), #d45e4a var(--op-one) var(--op-two), #23875a var(--op-two) var(--op-three), #bc7e12 var(--op-three) 100%);
}

.op-donut.is-empty { background: #e5ebf0; }

.op-donut::before {
    content: "";
    position: absolute;
    inset: 22px;
    border-radius: 50%;
    background: #ffffff;
}

.op-donut > span {
    position: relative;
    z-index: 1;
    text-align: center;
}

.op-donut strong,
.op-donut small {
    display: block;
}

.op-donut strong {
    color: #142236;
    font-size: 28px;
    line-height: 1;
}

.op-donut small {
    margin-top: 5px;
    color: #627084 !important;
    font-size: 8px;
    font-weight: 800;
}

.op-chart-legend {
    display: grid;
    gap: 4px;
}

.op-chart-legend > div {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 7px 3px;
    border-bottom: 1px solid #e7ebf0;
    color: #4c596b;
    font-size: 11px;
}

.op-chart-legend > div:last-child { border-bottom: 0; }

.op-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.op-chart-legend strong {
    color: #253044;
    font-size: 11px;
}

.op-dot {
    width: 9px;
    height: 9px;
    display: block;
    border-radius: 50%;
}

.op-dot-blue { background: #316fd7; }
.op-dot-coral { background: #d45e4a; }
.op-dot-green { background: #23875a; }
.op-dot-amber { background: #bc7e12; }

.op-shortcut-bar {
    min-height: 66px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 13px 17px;
    border: 1px solid #dfe6ed;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 7px 18px rgba(23, 32, 51, 0.05);
}

.op-shortcut-title {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 18px;
    border-right: 1px solid #e1e7ed;
}

.op-shortcut-title > span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff2d2;
    color: #b5760d;
}

.op-shortcut-title strong,
.op-shortcut-title small {
    display: block;
}

.op-shortcut-title strong { color: #253044; font-size: 11px; }
.op-shortcut-title small { margin-top: 2px; color: #667386 !important; font-size: 9px; }

.op-shortcut-links {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.op-shortcut-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 6px;
    color: #465568;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.op-shortcut-links a:hover {
    background: #eaf6f4;
    color: #087f78;
    text-decoration: none;
}

.op-shortcut-links i { color: #0f877e; }

/* Page transition splash */
body.hm-transition-active {
    overflow: hidden !important;
}

.hm-page-transition {
    position: fixed;
    inset: 0;
    z-index: 2000000;
    display: grid;
    place-items: center;
    padding: 24px;
    background: #102b3a;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 180ms ease, visibility 180ms ease;
}

.hm-page-transition.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.hm-transition-inner {
    width: min(380px, 100%);
    text-align: center;
    transform: translateY(8px);
    transition: transform 220ms ease;
}

.hm-page-transition.is-visible .hm-transition-inner {
    transform: translateY(0);
}

.hm-transition-logo {
    width: 122px;
    height: 122px;
    margin: 0 auto 27px;
    overflow: hidden;
    border-radius: 9px;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
}

.hm-transition-logo img {
    width: 148px;
    max-width: none;
    height: 148px;
    margin: -13px;
    object-fit: cover;
}

.hm-page-transition h2 {
    margin: 0;
    color: #ffffff;
    font-size: 23px;
    font-weight: 800;
}

.hm-page-transition p {
    margin: 8px 0 22px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
}

.hm-transition-progress {
    width: 240px;
    height: 4px;
    margin: 0 auto 18px;
    overflow: hidden;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.16);
}

.hm-transition-progress span {
    display: block;
    width: 44%;
    height: 100%;
    border-radius: inherit;
    background: #55d5c8;
    animation: hm-transition-progress 900ms ease-in-out infinite;
}

.hm-page-transition small {
    color: rgba(255, 255, 255, 0.54);
    font-size: 10px;
}

.hm-page-transition small i {
    margin-right: 5px;
    color: #55d5c8;
}

@keyframes hm-transition-progress {
    0% { transform: translateX(-120%); }
    55% { transform: translateX(70%); }
    100% { transform: translateX(225%); }
}

@media (max-width: 1050px) {
    .op-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .op-main-grid { grid-template-columns: 1fr; }
    .op-analysis-panel {
        display: grid;
        grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1fr);
        align-items: center;
        gap: 20px;
    }
    .op-analysis-panel .op-panel-heading { grid-column: 1 / -1; margin-bottom: 0; }
}

@media (max-width: 767.98px) {
    .hm-main-nav .hm-nav-icon {
        width: 28px;
        height: 28px;
        border-radius: 50%;
        background: #eef5f6 !important;
    }

    .op-dashboard-header {
        display: block;
        padding-top: 0;
    }

    .op-brand-logo {
        width: 70px;
        height: 70px;
        flex-basis: 70px;
    }

    .op-brand-logo img {
        width: 86px;
        height: 86px;
        margin: -8px;
    }

    .op-brand-copy h1 { font-size: 26px; }
    .op-session-block { margin-top: 16px; }
    .op-module-grid { grid-template-columns: 1fr; }
    .op-analysis-panel { display: block; }
    .op-analysis-panel .op-panel-heading { margin-bottom: 18px; }
    .op-shortcut-bar { display: block; }
    .op-shortcut-title { margin-bottom: 10px; padding: 0 0 10px; border-right: 0; border-bottom: 1px solid #e1e7ed; }
    .op-shortcut-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
    .op-kpi-grid { grid-template-columns: 1fr; }
    .op-kpi { min-height: 142px; }
    .op-panel { padding: 18px; }
    .op-module { grid-template-columns: 42px minmax(0, 1fr) auto 8px; gap: 9px; }
    .op-session-block { display: grid; grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .hm-page-transition,
    .hm-transition-inner {
        transition: none;
    }

    .hm-transition-progress span {
        animation: none;
        width: 100%;
    }
}

/* Submenu and shortcut icon refinement */
.hm-nav-menu > a {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    min-height: 54px;
    padding: 8px 9px;
}

.hm-nav-menu .hm-menu-icon {
    --submenu-accent: #087f78;
    width: 34px;
    height: 34px;
    border: 1px solid color-mix(in srgb, var(--submenu-accent) 34%, #dfe6ed);
    border-radius: 50%;
    background: #ffffff !important;
    color: var(--submenu-accent);
    font-size: 13px;
    transition: color 140ms ease, background 140ms ease, border-color 140ms ease;
}

.hm-nav-menu .hm-menu-icon.hm-teal { --submenu-accent: #087f78; }
.hm-nav-menu .hm-menu-icon.hm-blue { --submenu-accent: #316fd7; }
.hm-nav-menu .hm-menu-icon.hm-cyan { --submenu-accent: #17849d; }
.hm-nav-menu .hm-menu-icon.hm-green { --submenu-accent: #23875a; }
.hm-nav-menu .hm-menu-icon.hm-coral { --submenu-accent: #d45e4a; }
.hm-nav-menu .hm-menu-icon.hm-red { --submenu-accent: #cb4949; }
.hm-nav-menu .hm-menu-icon.hm-amber { --submenu-accent: #b8780e; }

.hm-nav-menu > a:hover .hm-menu-icon,
.hm-nav-menu > a.is-current .hm-menu-icon {
    border-color: var(--submenu-accent);
    background: var(--submenu-accent) !important;
    color: #ffffff;
}

.hm-nav-menu > a strong {
    color: #263445;
    font-size: 12px;
}

.hm-nav-menu > a small {
    color: #687588;
    font-size: 10px;
}

.op-shortcut-links a {
    min-height: 42px;
    padding: 6px 10px 6px 7px;
    border: 1px solid #e1e7ed;
    background: #fbfcfd;
}

.op-shortcut-links a > i {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    flex: 0 0 28px;
    border-radius: 50%;
    background: #e7f5f3;
    color: #087f78;
    font-size: 11px;
}

.op-shortcut-links a:nth-child(2) > i { background: #fff3da; color: #b8780e; }
.op-shortcut-links a:nth-child(3) > i { background: #e9f7ef; color: #23875a; }
.op-shortcut-links a:nth-child(4) > i { background: #fff0ed; color: #d45e4a; }
.op-shortcut-links a:nth-child(5) > i { background: #e8f5f8; color: #17849d; }

.op-shortcut-links a:hover {
    border-color: #acd5d0;
    background: #f1f9f8;
}

/* High-contrast color pass */
body.hersley-admin {
    color: #263445;
    font-size: 13px;
}

.hersley-admin .page-wrapper p,
.hersley-admin .page-wrapper label,
.hersley-admin .page-wrapper .text-muted,
.hersley-admin .page-wrapper small {
    color: #5d6979;
}

.hersley-admin .page-wrapper h1,
.hersley-admin .page-wrapper h2,
.hersley-admin .page-wrapper h3,
.hersley-admin .page-wrapper h4,
.hersley-admin .page-wrapper h5,
.hersley-admin .page-wrapper h6,
.hersley-admin .page-wrapper .card-title {
    color: #142236;
    font-weight: 800;
}

.hm-app-header {
    border-bottom-color: #284758;
    background: #102b3a;
    box-shadow: 0 8px 24px rgba(9, 29, 41, 0.22);
}

.hm-header-brand,
.hm-header-brand:hover {
    color: #ffffff;
}

.hm-header-brand small {
    color: #63d6ca;
    font-size: 10px;
}

.hm-header-brand strong {
    color: #ffffff;
    font-size: 15px;
}

.hm-main-nav > .hm-nav-link,
.hm-nav-dropdown > .hm-nav-link {
    min-height: 50px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 13px;
    box-shadow: inset 0 -3px transparent;
}

.hm-main-nav > .hm-nav-link:hover,
.hm-main-nav > .hm-nav-link:focus,
.hm-main-nav > .hm-nav-link.is-active,
.hm-nav-dropdown > .hm-nav-link:hover,
.hm-nav-dropdown > .hm-nav-link:focus,
.hm-nav-dropdown > .hm-nav-link.is-active,
.hm-nav-dropdown.is-open > .hm-nav-link {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    box-shadow: inset 0 -3px #44c7b9;
}

.hm-main-nav > .hm-nav-link .hm-chevron,
.hm-nav-dropdown > .hm-nav-link .hm-chevron {
    color: rgba(255, 255, 255, 0.68);
}

.hm-nav-icon {
    width: 32px;
    height: 32px;
    font-size: 14px;
}

.hm-user-trigger {
    min-height: 50px;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.hm-user-trigger:hover,
.hm-user-trigger:focus,
.hm-user-trigger[aria-expanded="true"] {
    border-color: rgba(99, 214, 202, 0.7);
    background: rgba(255, 255, 255, 0.14);
}

.hm-user-copy small {
    color: rgba(255, 255, 255, 0.62);
    font-size: 10px;
}

.hm-user-copy strong {
    color: #ffffff;
    font-size: 12px;
}

.hm-user-trigger > i {
    color: rgba(255, 255, 255, 0.68);
}

.hm-user-avatar {
    background: #16a195;
    font-size: 14px;
}

.hm-nav-toggle {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff;
}

.hm-page-title strong {
    color: #1d2c40;
    font-size: 14px;
}

.hm-page-title span {
    color: #667386;
    font-size: 10px;
}

.hersley-admin .page-wrapper .btn,
.hersley-admin .page-wrapper button.btn,
.hersley-admin .page-wrapper a.btn {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 0;
    border-radius: 6px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    box-shadow: 0 5px 13px rgba(23, 32, 51, 0.13);
}

.hersley-admin .hm-button-enhanced .hm-button-icon {
    flex: 0 0 auto;
    font-size: 11px;
}

.hersley-admin .hm-button-create,
.hersley-admin .hm-button-save { background: #198754 !important; }
.hersley-admin .hm-button-update { background: #d08a10 !important; }
.hersley-admin .hm-button-delete { background: #d04444 !important; }
.hersley-admin .hm-button-detail { background: #356fd2 !important; }
.hersley-admin .hm-button-download,
.hersley-admin .hm-button-search,
.hersley-admin .hm-button-refresh { background: #0c8d84 !important; }
.hersley-admin .hm-button-close,
.hersley-admin .hm-button-back { background: #5b687b !important; }
.hersley-admin .hm-button-excel { background: #218653 !important; }
.hersley-admin .hm-button-pdf { background: #cc4545 !important; }
.hersley-admin .hm-button-print { background: #315a86 !important; }

.hersley-admin table.hm-data-table thead,
.hersley-admin table.hm-data-table thead.table-dark,
.hersley-admin table.hm-data-table thead.thead-dark,
.hersley-admin table.hm-data-table thead.table-success {
    background: #17384b !important;
}

.hersley-admin table.hm-data-table thead th,
.hersley-admin table.hm-data-table thead td,
.hersley-admin table.hm-data-table thead th[class*="alert-"],
.hersley-admin table.hm-data-table thead th[class*="bg-"] {
    height: 52px;
    padding: 12px 14px !important;
    border-bottom: 3px solid #21b7a8 !important;
    background: #17384b !important;
    color: #ffffff !important;
    font-size: 11px !important;
    line-height: 1.4;
}

.hersley-admin table.hm-data-table tbody td,
.hersley-admin table.hm-data-table tbody th {
    min-height: 52px;
    padding: 12px 14px !important;
    border-bottom-color: #dce4eb !important;
    color: #334155;
    font-size: 12.5px;
    font-weight: 500;
}

.hersley-admin table.hm-data-table tbody tr:nth-child(even) > td,
.hersley-admin table.hm-data-table.table-striped tbody tr:nth-of-type(odd) > td {
    background-color: #f5f8fb;
}

.hersley-admin table.hm-data-table tbody tr:hover > td,
.hersley-admin table.hm-data-table.table-hover tbody tr:hover > td {
    background-color: #dff4f1 !important;
    color: #172033;
}

.hersley-admin table.hm-data-table td a:not(.btn) {
    color: #076e68;
    font-size: 12px;
    font-weight: 800;
}

.hersley-admin table.hm-data-table .badge,
.hersley-admin table.hm-data-table [class*="badge-"] {
    min-height: 27px;
    padding: 5px 9px;
    color: #ffffff;
    font-size: 10px;
}

.hersley-admin table.hm-data-table .badge-success { background: #1d925a; }
.hersley-admin table.hm-data-table .badge-warning { background: #e69b1b; color: #172033; }
.hersley-admin table.hm-data-table .badge-info { background: #3976d4; }
.hersley-admin table.hm-data-table .badge-danger { background: #d64d43; }

.hersley-admin table.hm-data-table .hm-table-actions .btn,
.hersley-admin table.hm-data-table .hm-table-actions button,
.hersley-admin table.hm-data-table td > .btn {
    min-width: 35px;
    min-height: 35px;
    padding: 7px 10px;
    font-size: 11px;
    box-shadow: 0 4px 10px rgba(23, 32, 51, 0.13) !important;
}

.hersley-admin .dataTables_wrapper,
.hersley-admin .dataTables_wrapper .dataTables_info {
    color: #475467;
    font-size: 12px;
}

.hersley-admin .dataTables_wrapper .dataTables_length label,
.hersley-admin .dataTables_wrapper .dataTables_filter label {
    color: #344054;
    font-size: 12px;
}

.hersley-admin .dataTables_wrapper .dataTables_filter input,
.hersley-admin .dataTables_wrapper .dataTables_length select,
.hersley-admin .dataTables_wrapper select.form-control,
.hersley-admin .dataTables_wrapper input.form-control {
    min-height: 42px;
    color: #263445;
    font-size: 12px;
}

.hersley-admin button.dt-button.hm-button-excel,
.hersley-admin a.dt-button.hm-button-excel,
.hersley-admin .buttons-excel {
    border-color: #218653 !important;
    background: #218653 !important;
    color: #ffffff !important;
}

.hersley-admin button.dt-button.hm-button-pdf,
.hersley-admin a.dt-button.hm-button-pdf,
.hersley-admin .buttons-pdf {
    border-color: #cc4545 !important;
    background: #cc4545 !important;
    color: #ffffff !important;
}

.hersley-admin button.dt-button.hm-button-print,
.hersley-admin a.dt-button.hm-button-print,
.hersley-admin .buttons-print {
    border-color: #315a86 !important;
    background: #315a86 !important;
    color: #ffffff !important;
}

.hersley-admin .buttons-colvis {
    border-color: #c18419 !important;
    background: #c18419 !important;
    color: #ffffff !important;
}

.hersley-admin .dataTables_wrapper .dataTables_paginate .paginate_button,
.hersley-admin .dataTables_wrapper .pagination .page-link {
    min-width: 36px;
    height: 36px;
    color: #344054 !important;
    font-size: 11px;
    font-weight: 700;
}

.hersley-admin .hm-modal .modal-content {
    border-top-width: 5px !important;
}

.hersley-admin .hm-modal .modal-header,
.hersley-admin .hm-modal .modal-header[class*="bg-"] {
    min-height: 72px;
    background: color-mix(in srgb, var(--modal-accent) 10%, white) !important;
}

.hersley-admin .hm-modal-title-icon {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    background: var(--modal-accent);
    color: #ffffff;
    font-size: 14px;
}

.hersley-admin .hm-modal .modal-title,
.hersley-admin .hm-modal .modal-header h1,
.hersley-admin .hm-modal .modal-header h2,
.hersley-admin .hm-modal .modal-header h3,
.hersley-admin .hm-modal .modal-header h4,
.hersley-admin .hm-modal .modal-header h5 {
    color: #142236 !important;
    font-size: 19px !important;
}

.hersley-admin .hm-modal .modal-body {
    color: #334155;
    font-size: 13px;
}

.hersley-admin .hm-modal .modal-body p,
.hersley-admin .hm-modal .modal-body span {
    color: #475467;
}

.hersley-admin .hm-modal .modal-body strong {
    color: #172033;
}

.hersley-admin .hm-modal label,
.hersley-admin .hm-modal .control-label {
    color: #344054;
    font-size: 12px;
}

.hersley-admin .hm-modal .form-control,
.hersley-admin .hm-modal .custom-select,
.hersley-admin .hm-modal select,
.hersley-admin .hm-modal textarea,
.hersley-admin .hm-modal input[type="text"],
.hersley-admin .hm-modal input[type="number"],
.hersley-admin .hm-modal input[type="date"],
.hersley-admin .hm-modal input[type="email"],
.hersley-admin .hm-modal input[type="password"],
.hersley-admin .hm-modal input[type="file"] {
    min-height: 46px;
    background-color: #ffffff;
    color: #263445;
    font-size: 13px;
}

.hersley-admin .hm-modal .btn {
    min-height: 42px;
    padding: 9px 15px;
    font-size: 11px;
    box-shadow: 0 5px 13px rgba(23, 32, 51, 0.13) !important;
}

.hersley-admin .hm-modal table.hm-data-table thead th {
    height: 46px;
    color: #ffffff !important;
    font-size: 10px !important;
}

.hersley-admin .hm-modal table.hm-data-table tbody td {
    color: #334155;
    font-size: 11.5px;
}

.swal2-popup,
.sweet-alert,
.swal-modal {
    border-top-width: 5px !important;
}

.swal2-title,
.sweet-alert h2,
.swal-title {
    color: #142236 !important;
    font-size: 23px !important;
}

.swal2-html-container,
.sweet-alert p,
.swal-text {
    color: #475467 !important;
    font-size: 13px !important;
}

.hm-overview-copy > p,
.hm-section-heading p,
.hm-summary-content small,
.hm-module-tile strong,
.hm-module-tile small,
.hm-insight-legend > div,
.hm-quick-links a {
    color: #4b586a;
}

.hm-overview-copy > p { font-size: 14px; }
.hm-summary-content small { font-size: 11px; }
.hm-summary-content em { color: #657286; font-size: 10px; }
.hm-section-heading p { font-size: 11px; }
.hm-module-tile strong { color: #253044; font-size: 12px; }
.hm-module-tile small { font-size: 10px; }
.hm-insight-legend > div { font-size: 11px; }
.hm-quick-links a { font-size: 11px; }

@media (max-width: 1180px) {
    .hm-main-nav {
        border-color: #dbe3ea;
        background: #ffffff;
    }

    .hm-main-nav > .hm-nav-link,
    .hm-nav-dropdown > .hm-nav-link {
        color: #344054;
        box-shadow: none;
    }

    .hm-main-nav > .hm-nav-link:hover,
    .hm-main-nav > .hm-nav-link:focus,
    .hm-main-nav > .hm-nav-link.is-active,
    .hm-nav-dropdown > .hm-nav-link:hover,
    .hm-nav-dropdown > .hm-nav-link:focus,
    .hm-nav-dropdown > .hm-nav-link.is-active,
    .hm-nav-dropdown.is-open > .hm-nav-link {
        background: #e9f6f4;
        color: #087f78;
        box-shadow: none;
    }

    .hm-main-nav > .hm-nav-link .hm-chevron,
    .hm-nav-dropdown > .hm-nav-link .hm-chevron {
        color: #7d8998;
    }
}

@media (max-width: 767.98px) {
    .hm-user-trigger {
        background: transparent;
    }

    .hersley-admin table.hm-data-table thead th,
    .hersley-admin table.hm-data-table thead td {
        font-size: 10.5px !important;
    }

    .hersley-admin table.hm-data-table tbody td,
    .hersley-admin table.hm-data-table tbody th {
        font-size: 12px;
    }
}

@media (max-width: 420px) {
    .login-auth {
        align-items: flex-start;
        padding: 34px 20px 64px;
    }

    .login-card-logo {
        width: 138px;
        margin-bottom: 38px;
    }

    .login-heading h2 {
        font-size: 27px;
    }

    .login-splash-logo {
        margin-bottom: 38px;
    }
}

@media (max-height: 700px) and (min-width: 768px) {
    .login-card-logo {
        margin-bottom: 28px;
    }

    .login-heading {
        margin-bottom: 22px;
    }

    .login-security-note {
        margin-top: 18px;
        padding-top: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-visual .login-slide,
    .login-splash,
    .login-splash-content {
        transition: none;
    }

    .login-visual .login-slide,
    .login-splash-indicator::before,
    .login-splash-progress span {
        animation: none;
    }
}

/* Top navigation shell */
.hersley-admin .topbar,
.hersley-admin .left-sidebar {
    display: none !important;
}

.hersley-admin #main-wrapper {
    min-height: 100vh;
    background: #f4f7fb;
}

.hersley-admin .page-wrapper {
    width: 100%;
    min-height: calc(100vh - 74px);
    margin-left: 0 !important;
    padding-top: 0 !important;
    background: #f4f7fb !important;
}

.hm-app-header {
    position: sticky;
    top: 0;
    z-index: 1050;
    border-bottom: 1px solid #e4e9ef;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(24, 38, 57, 0.06);
}

.hm-header-inner {
    width: min(1600px, 100%);
    min-height: 74px;
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 0 auto;
    padding: 0 24px;
}

.hm-header-brand {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 11px;
    color: #172033;
    text-decoration: none;
}

.hm-header-brand:hover {
    color: #172033;
    text-decoration: none;
}

.hm-header-brand img {
    width: 134px;
    height: 42px;
    padding: 6px 9px;
    border-radius: 6px;
    background: #061217;
    object-fit: contain;
}

.hm-header-brand span,
.hm-header-brand small,
.hm-header-brand strong {
    display: block;
}

.hm-header-brand small {
    margin-bottom: 2px;
    color: #0f7c86;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.hm-header-brand strong {
    font-size: 14px;
    line-height: 1.15;
}

.hm-main-nav {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}

.hm-nav-link {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #3d4757;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    transition: color 150ms ease, background 150ms ease;
}

.hm-nav-link:hover,
.hm-nav-link:focus,
.hm-nav-link.is-active,
.hm-nav-dropdown.is-open > .hm-nav-link {
    background: #f1f6f6;
    color: #087f78;
    text-decoration: none;
    outline: 0;
}

.hm-nav-icon,
.hm-menu-icon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 6px;
}

.hm-nav-icon {
    width: 30px;
    height: 30px;
    font-size: 13px;
}

.hm-menu-icon {
    width: 38px;
    height: 38px;
    font-size: 15px;
}

.hm-teal { background: #e5f5f3; color: #087f78; }
.hm-blue { background: #eaf1ff; color: #306fd6; }
.hm-cyan { background: #e6f6fa; color: #16839b; }
.hm-green { background: #e9f7ef; color: #218353; }
.hm-coral { background: #fff0ed; color: #cf5b48; }
.hm-red { background: #ffeded; color: #c64747; }
.hm-amber { background: #fff5dd; color: #b47a14; }

.hm-chevron {
    margin-left: 1px;
    color: #98a2b3;
    font-size: 9px;
    transition: transform 160ms ease;
}

.hm-nav-dropdown {
    position: relative;
}

.hm-nav-dropdown.is-open .hm-chevron {
    transform: rotate(180deg);
}

.hm-nav-menu {
    position: absolute;
    top: calc(100% + 13px);
    left: 0;
    z-index: 1060;
    width: 330px;
    display: grid;
    gap: 3px;
    padding: 10px;
    border: 1px solid #e3e9ef;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 22px 55px rgba(23, 32, 51, 0.18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 150ms ease, visibility 150ms ease, transform 150ms ease;
}

.hm-nav-menu-right {
    right: 0;
    left: auto;
}

.hm-nav-dropdown.is-open .hm-nav-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.hm-menu-title {
    padding: 7px 9px 10px;
    border-bottom: 1px solid #edf0f4;
}

.hm-menu-title span,
.hm-menu-title small {
    display: block;
}

.hm-menu-title span {
    color: #172033;
    font-size: 13px;
    font-weight: 800;
}

.hm-menu-title small {
    margin-top: 3px;
    color: #8792a2;
    font-size: 11px;
}

.hm-nav-menu > a {
    min-width: 0;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    padding: 9px;
    border-radius: 6px;
    color: #344054;
    text-decoration: none;
}

.hm-nav-menu > a:hover,
.hm-nav-menu > a.is-current {
    background: #f6f8fa;
    color: #172033;
    text-decoration: none;
}

.hm-nav-menu > a span,
.hm-nav-menu > a strong,
.hm-nav-menu > a small {
    min-width: 0;
    display: block;
}

.hm-nav-menu > a strong {
    overflow: hidden;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-nav-menu > a small {
    margin-top: 2px;
    overflow: hidden;
    color: #8993a2;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-nav-toggle {
    width: 40px;
    height: 40px;
    display: none;
    place-items: center;
    padding: 0;
    border: 1px solid #dfe5eb;
    border-radius: 6px;
    background: #ffffff;
    color: #344054;
    cursor: pointer;
}

.hm-user-dropdown {
    position: relative;
    flex: 0 0 auto;
    margin-left: auto;
}

.hm-user-trigger {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 5px 9px 5px 6px;
    border: 1px solid #e2e7ed;
    border-radius: 6px;
    background: #fbfcfd;
    color: #344054;
    font-family: inherit;
    cursor: pointer;
}

.hm-user-trigger:hover,
.hm-user-trigger:focus,
.hm-user-trigger[aria-expanded="true"] {
    border-color: #b9d9d6;
    background: #f1f8f7;
    outline: 0;
}

.hm-user-avatar {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #087f78;
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
}

.hm-user-copy,
.hm-user-copy small,
.hm-user-copy strong {
    display: block;
    text-align: left;
}

.hm-user-copy small {
    color: #8a94a3;
    font-size: 9px;
}

.hm-user-copy strong {
    max-width: 100px;
    overflow: hidden;
    color: #273142;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-user-trigger > i {
    color: #98a2b3;
    font-size: 9px;
}

.hm-user-popover {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    z-index: 1060;
    width: 250px;
    padding: 9px;
    border: 1px solid #e3e9ef;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 20px 50px rgba(23, 32, 51, 0.18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 150ms ease, visibility 150ms ease, transform 150ms ease;
}

.hm-user-popover.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.hm-user-summary {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    padding: 8px;
    border-bottom: 1px solid #edf0f4;
}

.hm-user-summary .hm-user-avatar {
    width: 38px;
    height: 38px;
}

.hm-user-summary strong,
.hm-user-summary small {
    display: block;
}

.hm-user-summary strong {
    overflow: hidden;
    color: #172033;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-user-summary small {
    margin-top: 2px;
    color: #8b95a4;
    font-size: 10px;
}

.hm-user-popover > a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 6px;
    color: #475467;
    font-size: 12px;
    font-weight: 700;
}

.hm-user-popover > a:hover {
    background: #f5f7fa;
    color: #172033;
    text-decoration: none;
}

.hm-user-popover > a i {
    width: 18px;
    color: #087f78;
    text-align: center;
}

.hm-user-popover > a.hm-logout,
.hm-user-popover > a.hm-logout i {
    color: #c64747;
}

.hm-page-tools {
    border-bottom: 1px solid #e5eaf0;
    background: #f9fbfc;
}

.hm-page-tools-inner {
    width: min(1600px, 100%);
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 auto;
    padding: 8px 24px;
}

.hm-tool-button {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    padding: 0;
    border: 1px solid #dfe5eb;
    border-radius: 6px;
    background: #ffffff;
    color: #526071;
    font-size: 12px;
    cursor: pointer;
}

.hm-tool-button:hover,
.hm-tool-button:focus {
    border-color: #aad1cd;
    background: #edf7f6;
    color: #087f78;
    text-decoration: none;
    outline: 0;
}

.hm-page-title span,
.hm-page-title strong {
    display: block;
}

.hm-page-title span {
    margin-bottom: 1px;
    color: #98a2b3;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.hm-page-title strong {
    color: #263244;
    font-size: 13px;
    line-height: 1.2;
}

.hm-page-tool-actions {
    display: flex;
    gap: 7px;
    margin-left: auto;
}

.hersley-admin .container-fluid {
    width: min(1600px, 100%);
    margin: 0 auto;
    padding: 24px 24px 34px;
}

.hersley-admin .footer {
    margin: 0 !important;
    padding: 18px 24px;
    font-size: 11px;
}

/* Dashboard */
.hm-dashboard {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.hm-dashboard-welcome {
    min-height: 220px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(480px, 0.85fr);
    align-items: center;
    gap: 32px;
    padding: 34px;
    border-radius: 8px;
    background: #172b3a;
    box-shadow: 0 18px 42px rgba(23, 43, 58, 0.16);
}

.hm-welcome-copy {
    min-width: 0;
}

.hm-welcome-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 13px;
    color: #8edbd2;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.hm-dashboard-welcome h1 {
    margin: 0;
    color: #ffffff;
    font-size: 35px;
    line-height: 1.15;
    font-weight: 800;
}

.hm-dashboard-welcome p {
    max-width: 620px;
    margin: 12px 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 14px;
    line-height: 1.6;
}

.hm-welcome-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 24px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 11px;
}

.hm-welcome-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.hm-welcome-meta i {
    color: #8edbd2;
}

.hm-primary-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.hm-primary-action {
    position: relative;
    min-width: 0;
    min-height: 132px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
    column-gap: 10px;
    padding: 16px 28px 16px 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.07);
    color: #ffffff;
    text-decoration: none;
    transition: background 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.hm-primary-action:hover {
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    text-decoration: none;
    transform: translateY(-2px);
}

.hm-primary-action > span {
    grid-row: 1 / 3;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    font-size: 15px;
}

.hm-action-blue > span { background: #4a7fd9; }
.hm-action-coral > span { background: #d66b57; }
.hm-action-green > span { background: #2f9364; }

.hm-primary-action strong,
.hm-primary-action small {
    min-width: 0;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hm-primary-action strong {
    align-self: end;
    font-size: 12px;
    line-height: 1.25;
}

.hm-primary-action small {
    align-self: start;
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.58);
    font-size: 9px;
    white-space: nowrap;
}

.hm-primary-action > i {
    position: absolute;
    top: 50%;
    right: 12px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 10px;
    transform: translateY(-50%);
}

.hm-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.hm-stat-card {
    position: relative;
    min-width: 0;
    min-height: 142px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 26px;
    align-items: center;
    gap: 13px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    background: #ffffff;
    color: #172033;
    box-shadow: 0 8px 24px rgba(23, 32, 51, 0.06);
    text-decoration: none;
    transition: transform 150ms ease, box-shadow 150ms ease, border-color 150ms ease;
}

.hm-stat-card::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    background: var(--stat-color);
}

.hm-stat-card:hover {
    border-color: var(--stat-soft-border);
    color: #172033;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 15px 34px rgba(23, 32, 51, 0.1);
}

.hm-stat-blue { --stat-color: #3d74d8; --stat-soft: #edf3ff; --stat-soft-border: #bfd0f1; }
.hm-stat-coral { --stat-color: #d25f4b; --stat-soft: #fff0ed; --stat-soft-border: #efc1b8; }
.hm-stat-green { --stat-color: #258557; --stat-soft: #eaf7ef; --stat-soft-border: #b9dfc9; }
.hm-stat-amber { --stat-color: #b87b13; --stat-soft: #fff5df; --stat-soft-border: #ead19f; }

.hm-stat-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: var(--stat-soft);
    color: var(--stat-color);
    font-size: 18px;
}

.hm-stat-copy,
.hm-stat-copy small,
.hm-stat-copy strong,
.hm-stat-copy em {
    min-width: 0;
    display: block;
}

.hm-stat-copy small {
    overflow: hidden;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-stat-copy strong {
    margin: 4px 0 3px;
    color: #172033;
    font-size: 30px;
    line-height: 1;
}

.hm-stat-copy em {
    color: #98a2b3;
    font-size: 9px;
    font-style: normal;
}

.hm-stat-arrow {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--stat-soft);
    color: var(--stat-color);
    font-size: 9px;
    transform: rotate(45deg);
}

.hm-dashboard-content {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(340px, 0.55fr);
    gap: 14px;
}

.hm-dashboard-panel {
    min-width: 0;
    padding: 24px;
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(23, 32, 51, 0.06);
}

.hm-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 24px;
}

.hm-panel-heading span,
.hm-panel-heading h2,
.hm-panel-heading p {
    margin: 0;
}

.hm-panel-heading span {
    color: #087f78;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.25px;
}

.hm-panel-heading h2 {
    margin-top: 5px;
    color: #172033;
    font-size: 19px;
    font-weight: 800;
}

.hm-panel-heading p {
    margin-top: 5px;
    color: #8a94a3;
    font-size: 11px;
}

.hm-total-badge {
    flex: 0 0 auto;
    min-width: 108px;
    padding: 10px 13px;
    border: 1px solid #d9e8e6;
    border-radius: 7px;
    background: #f1f8f7;
    text-align: right;
}

.hm-total-badge small,
.hm-total-badge strong {
    display: block;
}

.hm-total-badge small {
    color: #6f7d8c;
    font-size: 9px;
}

.hm-total-badge strong {
    margin-top: 2px;
    color: #087f78;
    font-size: 20px;
}

.hm-progress-list {
    display: grid;
    gap: 20px;
}

.hm-progress-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 8px;
    color: #475467;
    font-size: 11px;
    font-weight: 700;
}

.hm-progress-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.hm-progress-meta i {
    width: 18px;
    color: var(--progress-color);
    text-align: center;
}

.hm-progress-meta strong {
    color: #172033;
    font-size: 11px;
}

.hm-progress-track {
    height: 7px;
    overflow: hidden;
    border-radius: 7px;
    background: #edf0f4;
}

.hm-progress-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--progress-color);
}

.hm-progress-blue { --progress-color: #3d74d8; }
.hm-progress-coral { --progress-color: #d25f4b; }
.hm-progress-green { --progress-color: #258557; }
.hm-progress-amber { --progress-color: #b87b13; }

.hm-shortcut-list {
    display: grid;
    gap: 7px;
}

.hm-shortcut-list > a {
    min-width: 0;
    min-height: 58px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    padding: 9px;
    border: 1px solid transparent;
    border-radius: 7px;
    color: #344054;
}

.hm-shortcut-list > a:hover {
    border-color: #e3e8ef;
    background: #f8fafb;
    color: #172033;
    text-decoration: none;
}

.hm-shortcut-list > a span,
.hm-shortcut-list > a strong,
.hm-shortcut-list > a small {
    min-width: 0;
    display: block;
}

.hm-shortcut-list > a strong {
    font-size: 11px;
    font-weight: 800;
}

.hm-shortcut-list > a small {
    margin-top: 2px;
    color: #9099a7;
    font-size: 9px;
}

.hm-shortcut-list > a > i {
    color: #a6afbb;
    font-size: 9px;
}

@media (max-width: 1320px) {
    .hm-header-brand > span:not(.hm-header-logo) {
        display: none;
    }

    .hm-header-inner {
        gap: 10px;
        padding-right: 18px;
        padding-left: 18px;
    }

    .hm-nav-link {
        gap: 6px;
        padding-right: 8px;
        padding-left: 8px;
    }

    .hm-dashboard-welcome {
        grid-template-columns: minmax(0, 1fr) minmax(420px, 0.9fr);
    }
}

@media (max-width: 1180px) {
    .hm-header-inner {
        position: relative;
    }

    .hm-nav-toggle {
        order: 3;
        display: grid;
    }

    .hm-main-nav {
        position: absolute;
        top: calc(100% + 1px);
        right: 16px;
        left: 16px;
        z-index: 1060;
        max-height: calc(100vh - 92px);
        display: none;
        align-items: stretch;
        padding: 10px;
        overflow-y: auto;
        border: 1px solid #dfe5eb;
        border-radius: 0 0 8px 8px;
        background: #ffffff;
        box-shadow: 0 22px 52px rgba(23, 32, 51, 0.18);
    }

    .hm-main-nav.is-open {
        display: grid;
    }

    .hm-main-nav > .hm-nav-link,
    .hm-nav-trigger {
        width: 100%;
        justify-content: flex-start;
    }

    .hm-nav-trigger .hm-chevron {
        margin-left: auto;
    }

    .hm-nav-menu,
    .hm-nav-menu-right {
        position: static;
        width: 100%;
        display: none;
        margin: 4px 0 8px;
        border: 0;
        border-left: 2px solid #d9e8e6;
        border-radius: 0 6px 6px 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: none;
    }

    .hm-nav-dropdown.is-open .hm-nav-menu {
        display: grid;
    }

    .hm-user-dropdown {
        order: 2;
    }

    .hm-dashboard-welcome,
    .hm-dashboard-content {
        grid-template-columns: 1fr;
    }

    .hm-primary-actions {
        max-width: 640px;
    }
}

@media (max-width: 900px) {
    .hm-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .hm-header-inner {
        min-height: 66px;
        padding: 0 14px;
    }

    .hm-header-brand img {
        width: 116px;
        height: 38px;
    }

    .hm-user-copy,
    .hm-user-trigger > i {
        display: none;
    }

    .hm-user-trigger {
        min-height: 40px;
        padding: 2px;
        border: 0;
        background: transparent;
    }

    .hm-user-popover {
        right: -48px;
    }

    .hm-main-nav {
        right: 10px;
        left: 10px;
    }

    .hm-page-tools-inner {
        min-height: 54px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .hersley-admin .container-fluid {
        padding: 16px 14px 28px;
    }

    .hm-dashboard-welcome {
        min-height: 0;
        gap: 26px;
        padding: 24px;
    }

    .hm-dashboard-welcome h1 {
        font-size: 28px;
    }

    .hm-primary-actions {
        grid-template-columns: 1fr;
    }

    .hm-primary-action {
        min-height: 78px;
    }

    .hm-dashboard-panel {
        padding: 20px;
    }
}

@media (max-width: 520px) {
    .hm-stat-grid {
        grid-template-columns: 1fr;
    }

    .hm-stat-card {
        min-height: 118px;
    }

    .hm-panel-heading {
        display: block;
    }

    .hm-total-badge {
        width: max-content;
        margin-top: 14px;
        text-align: left;
    }

    .hm-welcome-meta {
        display: grid;
        gap: 9px;
    }
}

/* Global data tables */
.hersley-admin .page-wrapper .table-responsive {
    position: relative;
    margin: 14px 0;
    overflow-x: auto;
    border: 1px solid #dfe6ed;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 7px 22px rgba(23, 32, 51, 0.05);
    scrollbar-color: #b8c4d1 #eef2f6;
    scrollbar-width: thin;
}

.hersley-admin .page-wrapper .table-responsive::-webkit-scrollbar,
.hersley-admin .dataTables_scrollBody::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

.hersley-admin .page-wrapper .table-responsive::-webkit-scrollbar-track,
.hersley-admin .dataTables_scrollBody::-webkit-scrollbar-track {
    background: #eef2f6;
}

.hersley-admin .page-wrapper .table-responsive::-webkit-scrollbar-thumb,
.hersley-admin .dataTables_scrollBody::-webkit-scrollbar-thumb {
    border: 2px solid #eef2f6;
    border-radius: 8px;
    background: #aebac7;
}

.hersley-admin .page-wrapper table.hm-data-table {
    width: 100% !important;
    min-width: 100%;
    margin: 0 !important;
    border: 1px solid #dfe6ed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 7px;
    background: #ffffff !important;
    color: #344054;
    font-size: 12px;
    box-shadow: 0 7px 22px rgba(23, 32, 51, 0.05);
}

.hersley-admin .table-responsive > table.hm-data-table,
.hersley-admin .dataTables_scroll table.hm-data-table {
    border: 0 !important;
    border-radius: 0;
    box-shadow: none;
}

.hersley-admin table.hm-data-table thead,
.hersley-admin table.hm-data-table thead.table-dark,
.hersley-admin table.hm-data-table thead.thead-dark,
.hersley-admin table.hm-data-table thead.table-success {
    background: #f1f5f8 !important;
}

.hersley-admin table.hm-data-table thead th,
.hersley-admin table.hm-data-table thead td,
.hersley-admin table.hm-data-table thead th[class*="alert-"],
.hersley-admin table.hm-data-table thead th[class*="bg-"] {
    height: 48px;
    padding: 11px 13px !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 2px solid #15958b !important;
    border-left: 0 !important;
    background: #f1f5f8 !important;
    color: #344054 !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.35;
    letter-spacing: 0 !important;
    text-align: left;
    text-transform: uppercase;
    vertical-align: middle !important;
    white-space: nowrap;
}

.hersley-admin table.hm-data-table thead th:first-child {
    padding-left: 17px !important;
}

.hersley-admin table.hm-data-table tbody td,
.hersley-admin table.hm-data-table tbody th {
    min-height: 48px;
    padding: 11px 13px !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid #e7ecf1 !important;
    border-left: 0 !important;
    background-color: #ffffff;
    color: #475467;
    font-size: 11px;
    line-height: 1.45;
    vertical-align: middle !important;
}

.hersley-admin table.hm-data-table tbody tr:nth-child(even) > td,
.hersley-admin table.hm-data-table.table-striped tbody tr:nth-of-type(odd) > td {
    background-color: #fafbfd;
}

.hersley-admin table.hm-data-table tbody tr:hover > td,
.hersley-admin table.hm-data-table.table-hover tbody tr:hover > td {
    background-color: #edf8f6 !important;
    color: #243143;
}

.hersley-admin table.hm-data-table tbody tr:last-child > td,
.hersley-admin table.hm-data-table tbody tr:last-child > th {
    border-bottom: 0 !important;
}

.hersley-admin table.hm-data-table tbody td:first-child {
    padding-left: 17px !important;
}

.hersley-admin table.hm-data-table td a:not(.btn) {
    color: #087f78;
    font-weight: 700;
    text-decoration: none;
}

.hersley-admin table.hm-data-table td a:not(.btn):hover {
    color: #075f5b;
    text-decoration: underline;
}

.hersley-admin table.hm-data-table .hm-table-actions {
    min-width: 96px;
    text-align: center;
    white-space: nowrap;
}

.hersley-admin table.hm-data-table .hm-table-actions .btn,
.hersley-admin table.hm-data-table .hm-table-actions button,
.hersley-admin table.hm-data-table td > .btn {
    min-width: 32px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 2px;
    padding: 6px 9px;
    border: 0 !important;
    border-radius: 5px !important;
    color: #ffffff !important;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    box-shadow: none !important;
}

.hersley-admin table.hm-data-table .btn-primary,
.hersley-admin table.hm-data-table .btn-info {
    background: #3d74d8 !important;
}

.hersley-admin table.hm-data-table .btn-success {
    background: #258557 !important;
}

.hersley-admin table.hm-data-table .btn-warning {
    background: #c18419 !important;
}

.hersley-admin table.hm-data-table .btn-danger {
    background: #c84e4e !important;
}

.hersley-admin table.hm-data-table .btn-secondary,
.hersley-admin table.hm-data-table .btn-dark {
    background: #596579 !important;
}

.hersley-admin table.hm-data-table .badge,
.hersley-admin table.hm-data-table [class*="badge-"] {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 5px;
    font-size: 9px;
    font-weight: 800;
}

.hersley-admin .dataTables_wrapper {
    width: 100%;
    color: #526071;
    font-size: 11px;
}

.hersley-admin .dataTables_wrapper::after {
    content: "";
    display: block;
    clear: both;
}

.hersley-admin .dataTables_wrapper .dataTables_length,
.hersley-admin .dataTables_wrapper .dataTables_filter {
    margin-bottom: 12px;
}

.hersley-admin .dataTables_wrapper .dataTables_length label,
.hersley-admin .dataTables_wrapper .dataTables_filter label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #667085;
    font-size: 10px;
    font-weight: 700;
}

.hersley-admin .dataTables_wrapper .dataTables_filter input,
.hersley-admin .dataTables_wrapper .dataTables_length select,
.hersley-admin .dataTables_wrapper select.form-control,
.hersley-admin .dataTables_wrapper input.form-control {
    min-height: 38px;
    margin: 0 !important;
    padding: 7px 11px;
    border: 1px solid #d7dfe8 !important;
    border-radius: 6px !important;
    background: #ffffff;
    color: #344054;
    font-size: 11px;
    box-shadow: none !important;
}

.hersley-admin .dataTables_wrapper .dataTables_filter input {
    width: min(260px, 48vw);
}

.hersley-admin .dataTables_wrapper .dataTables_filter input:focus,
.hersley-admin .dataTables_wrapper .dataTables_length select:focus {
    border-color: #15958b !important;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(21, 149, 139, 0.1) !important;
}

.hersley-admin .dataTables_wrapper .dataTables_info {
    padding-top: 14px !important;
    color: #7d8897;
    font-size: 10px;
}

.hersley-admin .dataTables_wrapper .dataTables_paginate {
    padding-top: 9px !important;
}

.hersley-admin .dataTables_wrapper .dataTables_paginate .paginate_button,
.hersley-admin .dataTables_wrapper .pagination .page-link {
    min-width: 34px;
    height: 34px;
    display: inline-grid !important;
    place-items: center;
    margin: 0 2px !important;
    padding: 5px 8px !important;
    border: 1px solid #dfe5eb !important;
    border-radius: 5px !important;
    background: #ffffff !important;
    color: #526071 !important;
    font-size: 10px;
    box-shadow: none !important;
}

.hersley-admin .dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.hersley-admin .dataTables_wrapper .pagination .page-link:hover {
    border-color: #a9d0cc !important;
    background: #edf8f6 !important;
    color: #087f78 !important;
}

.hersley-admin .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.hersley-admin .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.hersley-admin .dataTables_wrapper .pagination .active .page-link {
    border-color: #087f78 !important;
    background: #087f78 !important;
    color: #ffffff !important;
}

.hersley-admin .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.hersley-admin .dataTables_wrapper .pagination .disabled .page-link {
    opacity: 0.45;
    cursor: default;
}

.hersley-admin .dt-buttons,
.hersley-admin .dataTables_wrapper .dt-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
}

.hersley-admin button.dt-button,
.hersley-admin a.dt-button,
.hersley-admin div.dt-button,
.hersley-admin .buttons-html5,
.hersley-admin .buttons-print,
.hersley-admin .buttons-colvis {
    min-height: 36px !important;
    margin: 0 !important;
    padding: 7px 11px !important;
    border: 1px solid #dce3ea !important;
    border-radius: 5px !important;
    background: #ffffff !important;
    color: #475467 !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

.hersley-admin button.dt-button:hover,
.hersley-admin a.dt-button:hover,
.hersley-admin .buttons-html5:hover,
.hersley-admin .buttons-print:hover,
.hersley-admin .buttons-colvis:hover {
    border-color: #a9d0cc !important;
    background: #edf8f6 !important;
    color: #087f78 !important;
}

.hersley-admin .dataTables_wrapper .dataTables_processing {
    min-width: 220px;
    min-height: 58px;
    display: grid;
    place-items: center;
    padding: 14px;
    border: 1px solid #dfe6ed;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.96);
    color: #087f78;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 14px 34px rgba(23, 32, 51, 0.14);
}

.hersley-admin .dataTables_scrollHead {
    border: 1px solid #dfe6ed;
    border-bottom: 0;
    border-radius: 7px 7px 0 0;
    background: #f1f5f8;
}

.hersley-admin .dataTables_scrollBody {
    border: 1px solid #dfe6ed !important;
    border-top: 0 !important;
    border-radius: 0 0 7px 7px;
}

/* Global modal system */
.modal-backdrop.show,
.modal-backdrop.in {
    opacity: 0.58 !important;
    background: #172033;
}

.hersley-admin .hm-modal {
    padding-right: 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
}

.hersley-admin .hm-modal .modal-dialog {
    width: min(720px, calc(100% - 28px));
    max-width: none !important;
    margin: 28px auto;
}

.hersley-admin .hm-modal .modal-dialog.modal-lg,
.hersley-admin .hm-modal.hm-modal-with-table .modal-dialog,
.hersley-admin .hm-modal .modal-dialog.modal-xs {
    width: min(1080px, calc(100% - 28px));
    max-width: none !important;
}

.hersley-admin .hm-modal .modal-dialog.modal-xl,
.hersley-admin .hm-modal.hm-modal-wide .modal-dialog {
    width: min(1380px, calc(100% - 28px));
    max-width: none !important;
}

.hersley-admin .hm-modal .modal-content {
    --modal-accent: #0f7c86;
    overflow: hidden;
    border: 0 !important;
    border-top: 4px solid var(--modal-accent) !important;
    border-radius: 8px !important;
    background: #ffffff;
    box-shadow: 0 28px 78px rgba(10, 24, 42, 0.28) !important;
}

.hersley-admin .hm-modal-create .modal-content { --modal-accent: #258557; }
.hersley-admin .hm-modal-update .modal-content { --modal-accent: #c18419; }
.hersley-admin .hm-modal-delete .modal-content { --modal-accent: #c84e4e; }
.hersley-admin .hm-modal-detail .modal-content { --modal-accent: #3d74d8; }

.hersley-admin .hm-modal .modal-header,
.hersley-admin .hm-modal .modal-header[class*="bg-"] {
    min-height: 68px;
    display: flex;
    align-items: center;
    padding: 15px 20px !important;
    border-bottom: 1px solid #e4e9ef !important;
    background: #ffffff !important;
    color: #172033 !important;
}

.hersley-admin .hm-modal .modal-title,
.hersley-admin .hm-modal .modal-header h1,
.hersley-admin .hm-modal .modal-header h2,
.hersley-admin .hm-modal .modal-header h3,
.hersley-admin .hm-modal .modal-header h4,
.hersley-admin .hm-modal .modal-header h5 {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0;
    color: #172033 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.3;
    letter-spacing: 0 !important;
}

.hersley-admin .hm-modal-title-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    border-radius: 7px;
    background: color-mix(in srgb, var(--modal-accent) 12%, white);
    color: var(--modal-accent);
    font-size: 13px;
}

@supports not (background: color-mix(in srgb, red 10%, white)) {
    .hersley-admin .hm-modal-title-icon {
        background: #edf4f5;
    }
}

.hersley-admin .hm-modal .modal-header .close {
    width: 36px;
    height: 36px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 36px;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    border: 0;
    border-radius: 6px !important;
    background: #f1f4f7;
    color: #667085 !important;
    font-size: 22px;
    line-height: 1;
    opacity: 1 !important;
    text-shadow: none !important;
}

.hersley-admin .hm-modal .modal-header .close:hover,
.hersley-admin .hm-modal .modal-header .close:focus {
    background: #ffecec;
    color: #c84e4e !important;
    outline: 0;
}

.hersley-admin .hm-modal .modal-body {
    max-height: calc(100vh - 190px);
    padding: 22px !important;
    overflow-y: auto;
    background: #ffffff !important;
    color: #344054;
}

.hersley-admin .hm-modal .modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 20px !important;
    border-top: 1px solid #e4e9ef !important;
    background: #f7f9fb !important;
}

.hersley-admin .hm-modal .form-group {
    margin-bottom: 16px;
}

.hersley-admin .hm-modal label,
.hersley-admin .hm-modal .control-label {
    display: block;
    margin-bottom: 7px;
    color: #475467;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
}

.hersley-admin .hm-modal .form-control,
.hersley-admin .hm-modal .custom-select,
.hersley-admin .hm-modal select,
.hersley-admin .hm-modal textarea,
.hersley-admin .hm-modal input[type="text"],
.hersley-admin .hm-modal input[type="number"],
.hersley-admin .hm-modal input[type="date"],
.hersley-admin .hm-modal input[type="email"],
.hersley-admin .hm-modal input[type="password"],
.hersley-admin .hm-modal input[type="file"] {
    min-height: 43px;
    padding: 8px 11px;
    border: 1px solid #d7dfe8 !important;
    border-radius: 6px !important;
    background-color: #fbfcfd;
    color: #344054;
    font-size: 11px;
    box-shadow: none !important;
}

.hersley-admin .hm-modal textarea {
    min-height: 96px;
    resize: vertical;
}

.hersley-admin .hm-modal .form-control:focus,
.hersley-admin .hm-modal .custom-select:focus,
.hersley-admin .hm-modal select:focus,
.hersley-admin .hm-modal textarea:focus,
.hersley-admin .hm-modal input:focus {
    border-color: var(--modal-accent) !important;
    background: #ffffff;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(15, 124, 134, 0.1) !important;
}

.hersley-admin .hm-modal .input-group-text {
    border-color: #d7dfe8;
    border-radius: 6px;
    background: #f0f4f7;
    color: #667085;
    font-size: 10px;
}

.hersley-admin .hm-modal .btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 0 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    font-size: 10px;
    font-weight: 800;
    box-shadow: none !important;
}

.hersley-admin .hm-modal .btn-primary,
.hersley-admin .hm-modal .btn-info { background: #3d74d8 !important; }
.hersley-admin .hm-modal .btn-success { background: #258557 !important; }
.hersley-admin .hm-modal .btn-warning { background: #c18419 !important; }
.hersley-admin .hm-modal .btn-danger { background: #c84e4e !important; }
.hersley-admin .hm-modal .btn-secondary,
.hersley-admin .hm-modal .btn-light { background: #667085 !important; }

.hersley-admin .hm-modal .table-responsive {
    margin: 8px 0;
    box-shadow: none;
}

.hersley-admin .hm-modal table.hm-data-table {
    font-size: 11px;
    box-shadow: none;
}

.hersley-admin .hm-modal table.hm-data-table thead th {
    height: 43px;
    padding: 9px 11px !important;
    font-size: 9px !important;
}

.hersley-admin .hm-modal table.hm-data-table tbody td {
    padding: 9px 11px !important;
    font-size: 10px;
}

/* SweetAlert dialogs */
.swal2-container,
.swal-overlay {
    backdrop-filter: blur(2px);
}

.swal2-popup,
.sweet-alert,
.swal-modal {
    overflow: hidden;
    border: 0 !important;
    border-top: 4px solid #0f7c86 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 28px 78px rgba(10, 24, 42, 0.3) !important;
}

.swal2-title,
.sweet-alert h2,
.swal-title {
    color: #172033 !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
}

.swal2-html-container,
.sweet-alert p,
.swal-text {
    color: #667085 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}

.swal2-actions,
.swal-footer {
    gap: 8px;
}

.swal2-confirm,
.swal2-cancel,
.swal-button {
    min-height: 40px !important;
    padding: 8px 15px !important;
    border: 0 !important;
    border-radius: 6px !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

.swal2-confirm,
.swal-button--confirm,
.swal-button:not(.swal-button--cancel) {
    background: #087f78 !important;
}

.swal2-cancel,
.swal-button--cancel {
    background: #667085 !important;
    color: #ffffff !important;
}

.swal2-icon {
    transform: scale(0.86);
}

@media (max-width: 767.98px) {
    .hersley-admin .dataTables_wrapper .dataTables_length,
    .hersley-admin .dataTables_wrapper .dataTables_filter {
        width: 100%;
        float: none;
        text-align: left;
    }

    .hersley-admin .dataTables_wrapper .dataTables_filter label,
    .hersley-admin .dataTables_wrapper .dataTables_filter input {
        width: 100%;
    }

    .hersley-admin .dataTables_wrapper .dataTables_info,
    .hersley-admin .dataTables_wrapper .dataTables_paginate {
        width: 100%;
        float: none;
        text-align: left;
    }

    .hersley-admin .dataTables_wrapper .dataTables_paginate {
        overflow-x: auto;
        white-space: nowrap;
    }

    .hersley-admin .hm-modal .modal-dialog,
    .hersley-admin .hm-modal .modal-dialog.modal-lg,
    .hersley-admin .hm-modal .modal-dialog.modal-xl,
    .hersley-admin .hm-modal.hm-modal-wide .modal-dialog,
    .hersley-admin .hm-modal.hm-modal-with-table .modal-dialog {
        width: calc(100% - 16px);
        margin: 8px auto;
    }

    .hersley-admin .hm-modal .modal-header {
        min-height: 60px;
        padding: 12px 14px !important;
    }

    .hersley-admin .hm-modal .modal-body {
        max-height: calc(100vh - 138px);
        padding: 15px !important;
    }

    .hersley-admin .hm-modal .modal-footer {
        flex-wrap: wrap;
        padding: 12px 14px !important;
    }

    .hersley-admin .hm-modal .modal-footer .btn {
        flex: 1 1 auto;
    }
}

/* Hersley Saglik logo */
.hm-header-logo {
    width: 58px;
    height: 58px;
    display: block;
    flex: 0 0 58px;
    overflow: hidden;
    border-radius: 7px;
    background: #ffffff;
}

.hm-header-logo img {
    width: 72px;
    max-width: none;
    height: 72px;
    margin: -7px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    object-fit: cover;
}

.login-brand-mark {
    width: 86px;
    height: 86px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: #ffffff;
}

.login-brand-mark img {
    width: 106px;
    max-width: none;
    height: 106px;
    margin: -10px;
    object-fit: cover;
}

.login-card-logo {
    width: 104px;
    height: 104px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #e3e9ef;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(23, 32, 51, 0.08);
}

.login-card-logo img {
    width: 126px;
    max-width: none;
    height: 126px;
    margin: -11px;
    object-fit: cover;
}

.login-splash-logo {
    width: 128px;
    max-width: none;
    height: 128px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #e0e7ed;
    border-radius: 8px;
    background: #ffffff;
    object-fit: cover;
    transform: scale(1.08);
}

/* Dashboard overview */
.hm-overview {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.hm-overview-header {
    min-height: 170px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 36px;
    padding: 8px 4px 24px;
    border-bottom: 1px solid #dfe5ec;
}

.hm-overview-copy {
    min-width: 0;
}

.hm-overview-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: #087f78;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.hm-overview-kicker i {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    background: #e6f5f3;
}

.hm-overview h1 {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 800;
}

.hm-overview-copy > p {
    margin: 9px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.55;
}

.hm-overview-copy > p strong {
    color: #253044;
    font-weight: 800;
}

.hm-overview-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.hm-overview-action {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 13px;
    border: 1px solid #dce3ea;
    border-radius: 6px;
    background: #ffffff;
    color: #475467;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 4px 12px rgba(23, 32, 51, 0.04);
}

.hm-overview-action:hover {
    border-color: #add2ce;
    background: #f2f8f7;
    color: #087f78;
    text-decoration: none;
}

.hm-overview-primary {
    border-color: #087f78;
    background: #087f78;
    color: #ffffff;
}

.hm-overview-primary:hover {
    border-color: #066c67;
    background: #066c67;
    color: #ffffff;
}

.hm-overview-brand {
    display: flex;
    align-items: center;
    gap: 18px;
}

.hm-overview-logo {
    width: 116px;
    height: 116px;
    overflow: hidden;
    border-radius: 8px;
    background: #ffffff;
}

.hm-overview-logo img {
    width: 142px;
    max-width: none;
    height: 142px;
    margin: -13px;
    object-fit: cover;
}

.hm-overview-date {
    min-width: 116px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 13px;
    border-left: 3px solid #1aa89d;
    background: #ffffff;
    color: #667085;
    box-shadow: 0 7px 20px rgba(23, 32, 51, 0.06);
}

.hm-overview-date > i {
    color: #0f7c86;
}

.hm-overview-date span,
.hm-overview-date small,
.hm-overview-date strong {
    display: block;
}

.hm-overview-date small {
    color: #98a2b3;
    font-size: 9px;
}

.hm-overview-date strong {
    margin-top: 2px;
    color: #344054;
    font-size: 11px;
}

.hm-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.hm-summary-card {
    --summary-color: #3d74d8;
    --summary-soft: #edf3ff;
    min-width: 0;
    min-height: 154px;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    grid-template-rows: 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 20px;
    border: 1px solid #e2e8ef;
    border-top: 3px solid var(--summary-color);
    border-radius: 7px;
    background: #ffffff;
    color: #172033;
    box-shadow: 0 7px 22px rgba(23, 32, 51, 0.06);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.hm-summary-card:hover {
    color: #172033;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(23, 32, 51, 0.1);
}

.hm-summary-blue { --summary-color: #3d74d8; --summary-soft: #edf3ff; }
.hm-summary-coral { --summary-color: #d45f4c; --summary-soft: #fff0ed; }
.hm-summary-green { --summary-color: #258557; --summary-soft: #eaf7ef; }
.hm-summary-amber { --summary-color: #b77b14; --summary-soft: #fff5df; }

.hm-summary-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: var(--summary-soft);
    color: var(--summary-color);
    font-size: 17px;
}

.hm-summary-content,
.hm-summary-content small,
.hm-summary-content strong,
.hm-summary-content em {
    min-width: 0;
    display: block;
}

.hm-summary-content small {
    overflow: hidden;
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-summary-content strong {
    margin: 4px 0 3px;
    color: #172033;
    font-size: 29px;
    line-height: 1;
}

.hm-summary-content em {
    color: #98a2b3;
    font-size: 9px;
    font-style: normal;
}

.hm-summary-link {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 11px;
    border-top: 1px solid #edf0f4;
    color: var(--summary-color);
    font-size: 9px;
    font-weight: 800;
}

.hm-summary-link i {
    font-size: 8px;
}

.hm-workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(330px, 0.45fr);
    gap: 14px;
}

.hm-command-center,
.hm-data-insight,
.hm-quick-access {
    min-width: 0;
    border: 1px solid #e2e8ef;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 7px 22px rgba(23, 32, 51, 0.05);
}

.hm-command-center,
.hm-data-insight {
    padding: 23px;
}

.hm-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.hm-section-heading span,
.hm-section-heading h2,
.hm-section-heading p {
    margin: 0;
}

.hm-section-heading > div > span {
    color: #0f7c86;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.25px;
}

.hm-section-heading h2 {
    margin-top: 4px;
    color: #172033;
    font-size: 19px;
    font-weight: 800;
}

.hm-section-heading p {
    margin-top: 4px;
    color: #8a94a3;
    font-size: 10px;
}

.hm-section-count {
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 5px;
    background: #eef7f6;
    color: #087f78;
    font-size: 9px;
    font-weight: 800;
}

.hm-module-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.hm-module-tile {
    min-width: 0;
    min-height: 76px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto 10px;
    align-items: center;
    gap: 11px;
    padding: 12px;
    border: 1px solid #e7ebf0;
    border-radius: 6px;
    color: #344054;
    transition: border-color 150ms ease, background 150ms ease;
}

.hm-module-tile:hover {
    border-color: #b8d8d4;
    background: #f7fbfa;
    color: #172033;
    text-decoration: none;
}

.hm-module-tile > span,
.hm-module-tile strong,
.hm-module-tile small {
    min-width: 0;
    display: block;
}

.hm-module-tile strong {
    overflow: hidden;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-module-tile small {
    margin-top: 3px;
    overflow: hidden;
    color: #929caa;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hm-module-tile em {
    min-width: 26px;
    padding: 4px 6px;
    border-radius: 5px;
    background: #f0f3f6;
    color: #647184;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    text-align: center;
}

.hm-module-tile > i {
    color: #a6afbb;
    font-size: 8px;
}

.hm-donut-wrap {
    display: grid;
    place-items: center;
    padding: 5px 0 22px;
}

.hm-donut {
    position: relative;
    width: 164px;
    height: 164px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(#3d74d8 0 var(--slice-one), #d45f4c var(--slice-one) var(--slice-two), #258557 var(--slice-two) var(--slice-three), #b77b14 var(--slice-three) 100%);
}

.hm-donut.is-empty {
    background: #e8edf2;
}

.hm-donut::before {
    content: "";
    position: absolute;
    inset: 21px;
    border-radius: 50%;
    background: #ffffff;
}

.hm-donut > span {
    position: relative;
    z-index: 1;
    text-align: center;
}

.hm-donut strong,
.hm-donut small {
    display: block;
}

.hm-donut strong {
    color: #172033;
    font-size: 27px;
    line-height: 1;
}

.hm-donut small {
    margin-top: 5px;
    color: #8a94a3;
    font-size: 8px;
}

.hm-insight-legend {
    display: grid;
    gap: 9px;
}

.hm-insight-legend > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px solid #edf0f4;
    color: #586577;
    font-size: 10px;
}

.hm-insight-legend > div:last-child {
    border-bottom: 0;
}

.hm-insight-legend span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.hm-insight-legend strong {
    color: #253044;
    font-size: 10px;
}

.hm-legend-dot {
    width: 8px;
    height: 8px;
    display: block;
    border-radius: 50%;
}

.hm-dot-blue { background: #3d74d8; }
.hm-dot-coral { background: #d45f4c; }
.hm-dot-green { background: #258557; }
.hm-dot-amber { background: #b77b14; }

.hm-quick-access {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 18px;
}

.hm-quick-heading {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 18px;
    border-right: 1px solid #e5e9ee;
}

.hm-quick-heading > span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    background: #fff4d9;
    color: #b77912;
}

.hm-quick-heading strong,
.hm-quick-heading small {
    display: block;
}

.hm-quick-heading strong {
    color: #253044;
    font-size: 11px;
}

.hm-quick-heading small {
    margin-top: 2px;
    color: #929caa;
    font-size: 9px;
}

.hm-quick-links {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.hm-quick-links a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 6px;
    color: #556274;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.hm-quick-links a:hover {
    background: #f1f7f6;
    color: #087f78;
    text-decoration: none;
}

.hm-quick-links i {
    color: #0f7c86;
}

@media (max-width: 1120px) {
    .hm-overview-header {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .hm-overview-date {
        display: none;
    }

    .hm-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hm-workspace-grid {
        grid-template-columns: 1fr;
    }

    .hm-data-insight {
        display: grid;
        grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1fr);
        align-items: center;
        gap: 22px;
    }

    .hm-data-insight .hm-section-heading {
        grid-column: 1 / -1;
        margin-bottom: 0;
    }

    .hm-donut-wrap {
        padding-bottom: 5px;
    }
}

@media (max-width: 767.98px) {
    .hm-header-logo {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
    }

    .hm-header-logo img {
        width: 64px;
        height: 64px;
        margin: -6px;
    }

    .hm-overview-header {
        min-height: 0;
        display: block;
        padding: 4px 0 20px;
    }

    .hm-overview-brand {
        display: none;
        position: absolute;
        top: 136px;
        right: 20px;
    }

    .hm-overview-logo {
        width: 76px;
        height: 76px;
        opacity: 0.13;
    }

    .hm-overview-logo img {
        width: 94px;
        height: 94px;
        margin: -9px;
    }

    .hm-overview h1 {
        font-size: 29px;
    }

    .hm-overview-copy > p {
        max-width: 390px;
        padding-right: 50px;
    }

    .hm-overview-actions {
        display: grid;
        grid-template-columns: 1fr;
        max-width: 320px;
    }

    .hm-overview-action {
        justify-content: flex-start;
    }

    .hm-module-grid {
        grid-template-columns: 1fr;
    }

    .hm-data-insight {
        display: block;
    }

    .hm-data-insight .hm-section-heading {
        margin-bottom: 20px;
    }

    .hm-quick-access {
        display: block;
    }

    .hm-quick-heading {
        margin-bottom: 10px;
        padding: 0 0 11px;
        border-right: 0;
        border-bottom: 1px solid #e5e9ee;
    }

    .hm-quick-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .hm-summary-grid {
        grid-template-columns: 1fr;
    }

    .hm-summary-card {
        min-height: 136px;
    }

    .hm-command-center,
    .hm-data-insight {
        padding: 19px;
    }

    .hm-module-tile {
        grid-template-columns: 38px minmax(0, 1fr) auto 8px;
        gap: 9px;
    }
}

/* Final vivid theme overrides */
body.hersley-admin {
    color: #263445;
    font-size: 13px;
}

.hm-app-header {
    border-bottom-color: #284758;
    background: #102b3a;
    box-shadow: 0 8px 24px rgba(9, 29, 41, 0.22);
}

.hm-header-brand,
.hm-header-brand:hover {
    color: #ffffff;
}

.hm-header-brand small { color: #63d6ca; font-size: 10px; }
.hm-header-brand strong { color: #ffffff; font-size: 15px; }

.hm-main-nav > .hm-nav-link,
.hm-nav-dropdown > .hm-nav-link {
    min-height: 50px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 13px;
    box-shadow: inset 0 -3px transparent;
}

.hm-main-nav > .hm-nav-link:hover,
.hm-main-nav > .hm-nav-link:focus,
.hm-main-nav > .hm-nav-link.is-active,
.hm-nav-dropdown > .hm-nav-link:hover,
.hm-nav-dropdown > .hm-nav-link:focus,
.hm-nav-dropdown > .hm-nav-link.is-active,
.hm-nav-dropdown.is-open > .hm-nav-link {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    box-shadow: inset 0 -3px #44c7b9;
}

.hm-main-nav > .hm-nav-link .hm-chevron,
.hm-nav-dropdown > .hm-nav-link .hm-chevron {
    color: rgba(255, 255, 255, 0.7);
}

.hm-nav-icon {
    width: 32px;
    height: 32px;
    font-size: 14px;
}

.hm-user-trigger {
    min-height: 50px;
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff;
}

.hm-user-trigger:hover,
.hm-user-trigger:focus,
.hm-user-trigger[aria-expanded="true"] {
    border-color: rgba(99, 214, 202, 0.72);
    background: rgba(255, 255, 255, 0.15);
}

.hm-user-copy small { color: rgba(255, 255, 255, 0.68); font-size: 10px; }
.hm-user-copy strong { color: #ffffff; font-size: 12px; }
.hm-user-trigger > i { color: rgba(255, 255, 255, 0.72); }
.hm-user-avatar { background: #16a195; font-size: 14px; }

.hm-nav-toggle {
    border-color: rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

.hersley-admin .page-wrapper p,
.hersley-admin .page-wrapper label,
.hersley-admin .page-wrapper .text-muted,
.hersley-admin .page-wrapper small {
    color: #556274;
}

.hersley-admin .page-wrapper h1,
.hersley-admin .page-wrapper h2,
.hersley-admin .page-wrapper h3,
.hersley-admin .page-wrapper h4,
.hersley-admin .page-wrapper h5,
.hersley-admin .page-wrapper h6,
.hersley-admin .page-wrapper .card-title {
    color: #142236;
}

.hersley-admin .hm-button-create,
.hersley-admin .hm-button-save { background: #198754 !important; color: #ffffff !important; }
.hersley-admin .hm-button-update { background: #d08a10 !important; color: #ffffff !important; }
.hersley-admin .hm-button-delete { background: #d04444 !important; color: #ffffff !important; }
.hersley-admin .hm-button-detail { background: #356fd2 !important; color: #ffffff !important; }
.hersley-admin .hm-button-download,
.hersley-admin .hm-button-search,
.hersley-admin .hm-button-refresh { background: #0c8d84 !important; color: #ffffff !important; }
.hersley-admin .hm-button-close,
.hersley-admin .hm-button-back { background: #5b687b !important; color: #ffffff !important; }
.hersley-admin .hm-button-excel { background: #218653 !important; color: #ffffff !important; }
.hersley-admin .hm-button-pdf { background: #cc4545 !important; color: #ffffff !important; }
.hersley-admin .hm-button-print { background: #315a86 !important; color: #ffffff !important; }

.hersley-admin table.hm-data-table thead,
.hersley-admin table.hm-data-table thead.table-dark,
.hersley-admin table.hm-data-table thead.thead-dark,
.hersley-admin table.hm-data-table thead.table-success {
    background: #17384b !important;
}

.hersley-admin table.hm-data-table thead th,
.hersley-admin table.hm-data-table thead td,
.hersley-admin table.hm-data-table thead th[class*="alert-"],
.hersley-admin table.hm-data-table thead th[class*="bg-"] {
    height: 52px;
    padding: 12px 14px !important;
    border-bottom: 3px solid #21b7a8 !important;
    background: #17384b !important;
    color: #ffffff !important;
    font-size: 11px !important;
}

.hersley-admin table.hm-data-table tbody td,
.hersley-admin table.hm-data-table tbody th {
    min-height: 52px;
    padding: 12px 14px !important;
    color: #334155;
    font-size: 12.5px;
    font-weight: 500;
}

.hersley-admin table.hm-data-table tbody tr:nth-child(even) > td,
.hersley-admin table.hm-data-table.table-striped tbody tr:nth-of-type(odd) > td {
    background-color: #f5f8fb;
}

.hersley-admin table.hm-data-table tbody tr:hover > td,
.hersley-admin table.hm-data-table.table-hover tbody tr:hover > td {
    background-color: #dff4f1 !important;
    color: #172033;
}

.hersley-admin table.hm-data-table .badge,
.hersley-admin table.hm-data-table [class*="badge-"] {
    min-height: 27px;
    padding: 5px 9px;
    color: #ffffff;
    font-size: 10px;
}

.hersley-admin table.hm-data-table .badge-success { background: #1d925a; }
.hersley-admin table.hm-data-table .badge-warning { background: #e69b1b; color: #172033; }
.hersley-admin table.hm-data-table .badge-info { background: #3976d4; }
.hersley-admin table.hm-data-table .badge-danger { background: #d64d43; }

.hersley-admin table.hm-data-table .hm-table-actions .btn,
.hersley-admin table.hm-data-table .hm-table-actions button,
.hersley-admin table.hm-data-table td > .btn {
    min-width: 35px;
    min-height: 35px;
    padding: 7px 10px;
    font-size: 11px;
    box-shadow: 0 4px 10px rgba(23, 32, 51, 0.14) !important;
}

.hersley-admin .dataTables_wrapper,
.hersley-admin .dataTables_wrapper .dataTables_info {
    color: #475467;
    font-size: 12px;
}

.hersley-admin .dataTables_wrapper .dataTables_length label,
.hersley-admin .dataTables_wrapper .dataTables_filter label {
    color: #344054;
    font-size: 12px;
}

.hersley-admin .dataTables_wrapper .dataTables_filter input,
.hersley-admin .dataTables_wrapper .dataTables_length select,
.hersley-admin .dataTables_wrapper select.form-control,
.hersley-admin .dataTables_wrapper input.form-control {
    min-height: 42px;
    color: #263445;
    font-size: 12px;
}

.hersley-admin button.dt-button.hm-button-excel,
.hersley-admin a.dt-button.hm-button-excel,
.hersley-admin .buttons-excel {
    border-color: #218653 !important;
    background: #218653 !important;
    color: #ffffff !important;
}

.hersley-admin button.dt-button.hm-button-pdf,
.hersley-admin a.dt-button.hm-button-pdf,
.hersley-admin .buttons-pdf {
    border-color: #cc4545 !important;
    background: #cc4545 !important;
    color: #ffffff !important;
}

.hersley-admin button.dt-button.hm-button-print,
.hersley-admin a.dt-button.hm-button-print,
.hersley-admin .buttons-print {
    border-color: #315a86 !important;
    background: #315a86 !important;
    color: #ffffff !important;
}

.hersley-admin .buttons-colvis {
    border-color: #c18419 !important;
    background: #c18419 !important;
    color: #ffffff !important;
}

.hersley-admin .hm-modal .modal-content {
    border-top-width: 5px !important;
}

.hersley-admin .hm-modal .modal-header,
.hersley-admin .hm-modal .modal-header[class*="bg-"] {
    min-height: 72px;
    background: color-mix(in srgb, var(--modal-accent) 10%, white) !important;
}

.hersley-admin .hm-modal-title-icon {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    background: var(--modal-accent);
    color: #ffffff;
    font-size: 14px;
}

.hersley-admin .hm-modal .modal-title,
.hersley-admin .hm-modal .modal-header h1,
.hersley-admin .hm-modal .modal-header h2,
.hersley-admin .hm-modal .modal-header h3,
.hersley-admin .hm-modal .modal-header h4,
.hersley-admin .hm-modal .modal-header h5 {
    color: #142236 !important;
    font-size: 19px !important;
}

.hersley-admin .hm-modal .modal-body {
    color: #334155;
    font-size: 13px;
}

.hersley-admin .hm-modal .modal-body p,
.hersley-admin .hm-modal .modal-body span { color: #475467; }
.hersley-admin .hm-modal .modal-body strong { color: #172033; }

.hersley-admin .hm-modal label,
.hersley-admin .hm-modal .control-label {
    color: #344054;
    font-size: 12px;
}

.hersley-admin .hm-modal .form-control,
.hersley-admin .hm-modal .custom-select,
.hersley-admin .hm-modal select,
.hersley-admin .hm-modal textarea,
.hersley-admin .hm-modal input[type="text"],
.hersley-admin .hm-modal input[type="number"],
.hersley-admin .hm-modal input[type="date"],
.hersley-admin .hm-modal input[type="email"],
.hersley-admin .hm-modal input[type="password"],
.hersley-admin .hm-modal input[type="file"] {
    min-height: 46px;
    background-color: #ffffff;
    color: #263445;
    font-size: 13px;
}

.hersley-admin .hm-modal .btn {
    min-height: 42px;
    padding: 9px 15px;
    font-size: 11px;
    box-shadow: 0 5px 13px rgba(23, 32, 51, 0.14) !important;
}

.hm-overview-copy > p { color: #4b586a; font-size: 14px; }
.hm-summary-content small { color: #4b586a; font-size: 11px; }
.hm-summary-content em { color: #657286; font-size: 10px; }
.hm-section-heading p { color: #566477; font-size: 11px; }
.hm-module-tile strong { color: #253044; font-size: 12px; }
.hm-module-tile small { color: #627084; font-size: 10px; }
.hm-insight-legend > div { color: #4b586a; font-size: 11px; }
.hm-quick-links a { color: #465568; font-size: 11px; }

@media (max-width: 1180px) {
    .hm-main-nav {
        border-color: #dbe3ea;
        background: #ffffff;
    }

    .hm-main-nav > .hm-nav-link,
    .hm-nav-dropdown > .hm-nav-link {
        color: #344054;
        box-shadow: none;
    }

    .hm-main-nav > .hm-nav-link:hover,
    .hm-main-nav > .hm-nav-link:focus,
    .hm-main-nav > .hm-nav-link.is-active,
    .hm-nav-dropdown > .hm-nav-link:hover,
    .hm-nav-dropdown > .hm-nav-link:focus,
    .hm-nav-dropdown > .hm-nav-link.is-active,
    .hm-nav-dropdown.is-open > .hm-nav-link {
        background: #e9f6f4;
        color: #087f78;
        box-shadow: none;
    }

    .hm-main-nav > .hm-nav-link .hm-chevron,
    .hm-nav-dropdown > .hm-nav-link .hm-chevron {
        color: #7d8998;
    }
}

@media (max-width: 767.98px) {
    .hm-user-trigger { background: transparent; }

    .hersley-admin table.hm-data-table thead th,
    .hersley-admin table.hm-data-table thead td {
        font-size: 10.5px !important;
    }

    .hersley-admin table.hm-data-table tbody td,
    .hersley-admin table.hm-data-table tbody th {
        font-size: 12px;
    }
}

/* Final submenu icon placement */
.hersley-admin .hm-nav-menu > a {
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 56px;
    padding: 8px 10px;
    border-radius: 6px;
}

.hersley-admin .hm-nav-menu > a:hover,
.hersley-admin .hm-nav-menu > a.is-current {
    background: color-mix(in srgb, var(--submenu-accent, #087f78) 7%, #ffffff);
}

.hersley-admin .hm-nav-menu .hm-menu-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-width: 1.5px;
    padding: 0 !important;
    font-size: 15px;
    line-height: 1;
    text-align: center;
    box-sizing: border-box;
    box-shadow: 0 3px 9px color-mix(in srgb, var(--submenu-accent) 12%, transparent);
}

.hersley-admin .hm-nav-menu .hm-menu-icon i {
    display: block;
    width: 18px;
    margin: 0 !important;
    line-height: 1 !important;
    text-align: center;
    transform: none !important;
}

.hersley-admin .hm-nav-menu > a > span:last-child {
    min-width: 0;
}

/* Compact stock and cargo modal actions */
.hersley-admin.hm-stock-page .hm-modal .modal-footer,
.hersley-admin.hm-cargo-page .hm-modal .modal-footer {
    justify-content: flex-end !important;
    flex-wrap: wrap;
    gap: 8px !important;
}

.hersley-admin.hm-stock-page .hm-modal .modal-footer .btn,
.hersley-admin.hm-cargo-page .hm-modal .modal-footer .btn {
    width: auto !important;
    min-width: 96px;
    max-width: 100%;
    min-height: 38px !important;
    flex: 0 0 auto !important;
    padding: 8px 14px !important;
    white-space: nowrap;
}

.hersley-admin.hm-stock-page .hm-modal .modal-footer .btn .hm-button-icon,
.hersley-admin.hm-cargo-page .hm-modal .modal-footer .btn .hm-button-icon {
    width: 14px;
    margin: 0 !important;
    font-size: 11px;
    text-align: center;
}

.hersley-admin.hm-stock-page #ekleModal .modal-dialog,
.hersley-admin.hm-stock-page #guncelleModal .modal-dialog,
.hersley-admin.hm-stock-page #girisModal .modal-dialog,
.hersley-admin.hm-stock-page #cikisModal .modal-dialog,
.hersley-admin.hm-stock-page #silModal .modal-dialog {
    width: min(680px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-stock-page #hareketModal .modal-dialog {
    width: min(920px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-stock-page #tumGecmisModal .modal-dialog {
    width: min(1180px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-cargo-page #KargoEkleModal .modal-dialog,
.hersley-admin.hm-cargo-page #modalGuncelle .modal-dialog {
    width: min(880px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-cargo-page #modalDetay .modal-dialog,
.hersley-admin.hm-cargo-page #modalUrun .modal-dialog,
.hersley-admin.hm-cargo-page #ArasSorgulaGuncelleModal .modal-dialog {
    width: min(940px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-cargo-page #modalSil .modal-dialog {
    width: min(560px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-cargo-page #modalFotoBuyuk .modal-dialog {
    width: min(1080px, calc(100% - 28px)) !important;
    max-width: none !important;
}

.hersley-admin.hm-cargo-page .hm-modal .modal-body .card {
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.hersley-admin.hm-cargo-page .hm-modal .modal-body .card-body {
    padding: 0 !important;
}

.hersley-admin.hm-cargo-page .hm-modal .modal-body .card-title {
    margin: 0 0 18px !important;
    padding: 0 0 12px;
    border-bottom: 1px solid #e4e9ef;
    color: #263445 !important;
    font-size: 13px !important;
    text-align: left !important;
}

.hersley-admin.hm-cargo-page .hm-modal .modal-body form > .modal-footer {
    position: sticky;
    z-index: 3;
    bottom: -22px;
    margin: 20px -22px -22px;
}

.hersley-admin.hm-cargo-page #modalFotoBuyuk .image-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px 0;
}

.hersley-admin.hm-cargo-page #modalFotoBuyuk .image-controls .btn {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px;
    padding: 0 !important;
    border: 1px solid #dfe6ed !important;
    background: #ffffff !important;
    color: #316fd7 !important;
}

@media (max-width: 767.98px) {
    .hersley-admin.hm-stock-page .hm-modal .modal-dialog,
    .hersley-admin.hm-cargo-page .hm-modal .modal-dialog {
        width: calc(100% - 16px) !important;
        margin: 8px auto !important;
    }

    .hersley-admin.hm-stock-page .hm-modal .modal-footer .btn,
    .hersley-admin.hm-cargo-page .hm-modal .modal-footer .btn {
        min-width: 88px;
        flex: 0 0 auto !important;
    }

    .hersley-admin.hm-cargo-page .hm-modal .modal-body form > .modal-footer {
        bottom: -15px;
        margin: 18px -15px -15px;
    }

    .hersley-admin.hm-cargo-page .hm-modal .form-group.row > label {
        padding-top: 0;
        text-align: left !important;
    }
}

/* Tender and direct-purchase modal refinement */
.hersley-admin.hm-tender-page .hm-modal .modal-dialog {
    width: min(760px, calc(100% - 28px)) !important;
    max-width: none !important;
    margin: 24px auto !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-dialog.modal-lg,
.hersley-admin.hm-tender-page .hm-modal.hm-modal-with-table .modal-dialog.modal-lg {
    width: min(900px, calc(100% - 28px)) !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-dialog.modal-xl,
.hersley-admin.hm-tender-page .hm-modal.hm-modal-wide .modal-dialog,
.hersley-admin.hm-tender-page .hm-modal.hm-modal-with-table .modal-dialog.modal-xl {
    width: min(1040px, calc(100% - 28px)) !important;
}

.hersley-admin.hm-tender-page #modalSil .modal-dialog {
    width: min(520px, calc(100% - 28px)) !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-body .card {
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-body .card-body {
    padding: 0 !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-body .card-title {
    margin: 0 0 18px !important;
    padding: 0 0 12px;
    border-bottom: 1px solid #e4e9ef;
    color: #263445 !important;
    font-size: 13px !important;
    text-align: left !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-footer {
    justify-content: flex-end !important;
    flex-wrap: wrap;
    gap: 8px !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-footer .btn {
    width: auto !important;
    min-width: 96px;
    max-width: 100%;
    min-height: 38px !important;
    flex: 0 0 auto !important;
    padding: 8px 14px !important;
    white-space: nowrap;
}

.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-icon {
    width: 14px;
    margin: 0 !important;
    font-size: 11px !important;
    text-align: center;
}

.hersley-admin.hm-tender-page .hm-modal .modal-body form > .modal-footer {
    position: sticky;
    z-index: 3;
    bottom: -22px;
    margin: 20px -22px -22px;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions {
    min-width: 154px;
    white-space: nowrap;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .btn,
.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions button,
.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .action-button {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 2px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    font-size: 0 !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .hm-button-icon {
    width: 16px;
    margin: 0 !important;
    color: currentColor !important;
    font-size: 12px !important;
    line-height: 1 !important;
    text-align: center;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .button-text {
    display: none !important;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .hm-button-create,
.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .hm-button-save,
.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-create,
.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-save {
    background: #198754 !important;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .hm-button-detail,
.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-detail {
    background: #356fd2 !important;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .hm-button-update,
.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-update {
    background: #c18419 !important;
}

.hersley-admin.hm-tender-page table.hm-data-table .hm-table-actions .hm-button-delete,
.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-delete {
    background: #c84e4e !important;
}

.hersley-admin.hm-tender-page .hm-modal .modal-footer .hm-button-close {
    background: #667085 !important;
}

.hersley-admin.hm-tender-page .hm-button-process {
    background: #087f78 !important;
    color: #ffffff !important;
}

.hersley-admin.hm-tender-page .myButton.hm-button-enhanced {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 9px 14px;
    border: 0;
    border-radius: 6px;
    background: #198754 !important;
    color: #ffffff !important;
    font-size: 11px;
    font-weight: 800;
    text-shadow: none;
    box-shadow: none;
}

/* Keep quick-module glyphs optically centered in their circles. */
.hersley-admin .op-module > .op-module-icon {
    width: 42px;
    height: 42px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px;
    padding: 0 !important;
    border-radius: 50%;
    font-size: 16px;
    line-height: 1;
    text-align: center;
    box-sizing: border-box;
}

.hersley-admin .op-module > .op-module-icon i {
    position: static !important;
    width: 18px;
    margin: 0 !important;
    padding: 0 !important;
    font-size: inherit;
    line-height: 1 !important;
    text-align: center;
    transform: none !important;
}

@media (max-width: 767.98px) {
    .hersley-admin.hm-tender-page .hm-modal .modal-dialog,
    .hersley-admin.hm-tender-page .hm-modal .modal-dialog.modal-lg,
    .hersley-admin.hm-tender-page .hm-modal .modal-dialog.modal-xl,
    .hersley-admin.hm-tender-page .hm-modal.hm-modal-wide .modal-dialog,
    .hersley-admin.hm-tender-page .hm-modal.hm-modal-with-table .modal-dialog {
        width: calc(100% - 16px) !important;
        margin: 8px auto !important;
    }

    .hersley-admin.hm-tender-page .hm-modal .modal-footer .btn {
        min-width: 88px;
        flex: 0 0 auto !important;
    }

    .hersley-admin.hm-tender-page .hm-modal .modal-body form > .modal-footer {
        bottom: -15px;
        margin: 18px -15px -15px;
    }

    .hersley-admin.hm-tender-page .hm-modal .form-group.row > label {
        padding-top: 0;
        text-align: left !important;
    }
}

/* Keep every modal above the sticky application menu. */
body.hersley-admin.modal-open .hm-app-header {
    z-index: 1000 !important;
}

body.hersley-admin .modal.show,
body.hersley-admin .modal.in {
    z-index: 3000 !important;
}

body.hersley-admin .modal-backdrop.show,
body.hersley-admin .modal-backdrop.in {
    z-index: 2990 !important;
}

/* Fixed asset inventory */
.hm-asset-page .container-fluid {
    padding: 0 !important;
}

.asset-workspace {
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 24px;
    color: #263445;
}

.asset-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 4px 0 22px;
    border-bottom: 1px solid #dfe6ed;
}

.asset-page-header-compact {
    padding-bottom: 18px;
}

.asset-heading,
.asset-header-actions {
    display: flex;
    align-items: center;
    gap: 13px;
}

.asset-heading > div {
    min-width: 0;
}

.asset-heading-icon,
.asset-section-title > span {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    border-radius: 7px;
    background: #e8f5f3;
    color: #087f78;
    font-size: 15px;
}

.asset-heading > div > small {
    display: block;
    margin-bottom: 3px;
    color: #087f78;
    font-size: 9px;
    font-weight: 900;
}

.asset-heading h1 {
    margin: 0;
    color: #172033;
    font-size: 24px;
    font-weight: 900;
    letter-spacing: 0;
}

.asset-heading p {
    margin: 4px 0 0;
    color: #687588;
    font-size: 11px;
}

.asset-back {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    border: 1px solid #dfe6ed;
    border-radius: 6px;
    background: #ffffff;
    color: #526071;
}

.asset-back:hover {
    border-color: #9fcfc9;
    background: #edf8f6;
    color: #087f78;
}

.asset-primary-action,
.asset-btn-save,
.asset-btn-edit,
.asset-btn-delete,
.asset-btn-secondary {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 14px !important;
    border: 0 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

.asset-primary-action,
.asset-btn-save { background: #087f78 !important; }
.asset-btn-edit { background: #316fd7 !important; }
.asset-btn-delete { background: #c84e4e !important; }
.asset-btn-secondary { background: #667085 !important; }

.asset-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 16px 0 0;
    padding: 11px 14px;
    border: 1px solid;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
}

.asset-alert-success { border-color: #b9dfcd; background: #edf8f2; color: #23754f; }
.asset-alert-danger { border-color: #efc0c0; background: #fff0f0; color: #a73d3d; }

.asset-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 18px 0;
}

.asset-stat {
    --asset-stat-color: #316fd7;
    min-width: 0;
    min-height: 84px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 14px 16px;
    border: 1px solid #dfe6ed;
    border-left: 4px solid var(--asset-stat-color);
    border-radius: 6px;
    background: #ffffff;
}

.asset-stat > span {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--asset-stat-color) 12%, #ffffff);
    color: var(--asset-stat-color);
    font-size: 13px;
}

.asset-stat small,
.asset-stat strong {
    display: block;
}

.asset-stat small { color: #687588; font-size: 9px; font-weight: 800; }
.asset-stat strong { margin-top: 3px; color: #172033; font-size: 24px; font-weight: 900; }
.asset-stat-blue { --asset-stat-color: #316fd7; }
.asset-stat-teal { --asset-stat-color: #087f78; }
.asset-stat-green { --asset-stat-color: #258557; }
.asset-stat-amber { --asset-stat-color: #c18419; }

.asset-list-section,
.asset-form,
.asset-detail-info,
.asset-photo-add,
.asset-existing-photos {
    background: #ffffff;
}

.asset-list-section {
    border-top: 3px solid #087f78;
    border-bottom: 1px solid #dfe6ed;
}

.asset-list-toolbar {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 16px;
    border-bottom: 1px solid #e4e9ef;
}

.asset-list-title h2,
.asset-section-title h2 {
    margin: 0;
    color: #263445;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0;
}

.asset-list-title small,
.asset-section-title small {
    display: block;
    margin-top: 3px;
    color: #7a8696;
    font-size: 9px;
}

.asset-filters {
    display: flex;
    align-items: center;
    gap: 8px;
}

.asset-search {
    min-width: 260px;
    height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0 11px;
    border: 1px solid #d7dfe8;
    border-radius: 6px;
    background: #fbfcfd;
    color: #8290a1;
}

.asset-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: #344054;
    font-size: 11px;
}

.asset-filters > select {
    width: 170px;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 6px !important;
    font-size: 10px;
}

.asset-table-wrap {
    min-height: 150px;
}

.hersley-admin .asset-table {
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}

.hersley-admin .asset-table thead th {
    height: 42px !important;
    border-color: #2b5362 !important;
    background: #173c4c !important;
    color: #ffffff !important;
    font-size: 9px !important;
}

.hersley-admin .asset-table tbody td {
    padding: 10px 12px !important;
    vertical-align: middle !important;
    font-size: 11px !important;
}

.asset-thumb {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #dfe6ed;
    border-radius: 6px;
    background: #edf4f5;
    color: #087f78;
}

.asset-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.asset-name-cell strong,
.asset-name-cell small,
.asset-name-cell em {
    display: block;
}

.asset-name-cell strong { color: #263445; font-size: 11.5px; }
.asset-name-cell small { margin-top: 2px; color: #087f78; font-size: 9px; font-weight: 800; }
.asset-name-cell em { margin-top: 2px; color: #7b8796; font-size: 9px; font-style: normal; }
.asset-location { display: flex; align-items: center; gap: 7px; color: #596779; }
.asset-location i { color: #d45e4a; }

.asset-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 900;
    white-space: nowrap;
}

.asset-status-green { background: #e7f6ed; color: #23754f; }
.asset-status-blue { background: #eaf1ff; color: #316fd7; }
.asset-status-amber { background: #fff4dd; color: #a66d0e; }
.asset-status-red { background: #ffeded; color: #b84343; }
.asset-photo-count { display: inline-flex; align-items: center; gap: 6px; color: #526071; font-weight: 800; }
.asset-photo-count i { color: #17849d; }

.asset-row-actions {
    display: flex;
    align-items: center;
    gap: 5px;
}

.asset-row-actions a {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dfe6ed;
    border-radius: 6px;
    background: #ffffff;
    color: #526071;
}

.asset-row-actions a:first-child { color: #316fd7; }
.asset-row-actions a:last-child { color: #c18419; }
.asset-row-actions a:hover { border-color: currentColor; background: #f7f9fb; }

.asset-empty {
    min-height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 9px;
    color: #8a96a5;
}

.asset-empty i { font-size: 25px; }
.asset-empty strong { font-size: 11px; }

.asset-form-page {
    max-width: 1180px;
}

.asset-form {
    margin-top: 18px;
    border-top: 3px solid #087f78;
    border-bottom: 1px solid #dfe6ed;
}

.asset-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.asset-form-section {
    min-width: 0;
    padding: 22px;
    border-bottom: 1px solid #e4e9ef;
}

.asset-form-section:nth-child(odd) {
    border-right: 1px solid #e4e9ef;
}

.asset-section-title {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 18px;
}

.asset-section-title > span {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    border-radius: 6px;
    font-size: 12px;
}

.asset-fields {
    display: grid;
    gap: 14px;
}

.asset-fields-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.asset-field,
.asset-field > div {
    min-width: 0;
}

.asset-field-pair {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 9px;
}

.asset-field label {
    display: block;
    margin-bottom: 6px;
    color: #475467;
    font-size: 10px;
    font-weight: 800;
}

.hm-asset-page .asset-field .form-control {
    min-height: 42px;
    padding: 8px 11px;
    border: 1px solid #d7dfe8;
    border-radius: 6px;
    background: #fbfcfd;
    color: #344054;
    font-size: 11px;
    box-shadow: none;
}

.hm-asset-page .asset-field textarea.form-control { min-height: 112px; resize: vertical; }
.hm-asset-page .asset-field .form-control:focus { border-color: #087f78; background: #ffffff; box-shadow: 0 0 0 3px rgba(8,127,120,.1); }
.asset-input-prefix { position: relative; }
.asset-input-prefix > span { position: absolute; z-index: 1; top: 50%; left: 12px; color: #788596; transform: translateY(-50%); }
.asset-input-prefix .form-control { padding-left: 28px !important; }
.asset-field .text-danger { display: block; margin-top: 4px; font-size: 9px; }
.asset-validation { margin: 0; padding: 12px 20px; border-bottom: 1px solid #efc0c0; background: #fff0f0; color: #a73d3d; font-size: 10px; }
.asset-validation:empty { display: none; }

.asset-photo-section,
.asset-existing-photos,
.asset-photo-add,
.asset-detail-info {
    padding: 22px;
}

.asset-photo-section {
    border-bottom: 1px solid #e4e9ef;
}

.asset-dropzone {
    min-height: 128px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    margin: 0;
    border: 1px dashed #9fc9c5;
    border-radius: 7px;
    background: #f5fbfa;
    color: #526071;
    cursor: pointer;
    transition: border-color 140ms ease, background 140ms ease;
}

.asset-dropzone:hover,
.asset-dropzone.is-dragging {
    border-color: #087f78;
    background: #eaf7f5;
}

.asset-dropzone input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.asset-dropzone-icon { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #087f78; color: #ffffff; }
.asset-dropzone strong { font-size: 11px; }
.asset-dropzone small { color: #7a8797; font-size: 9px; }
.asset-dropzone-small { min-height: 94px; }
.asset-upload-errors,
.asset-upload-server-error { display: block; margin-top: 8px; color: #b84343; font-size: 10px; font-weight: 800; }

.asset-preview-grid,
.asset-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.asset-preview-item,
.asset-gallery-item {
    position: relative;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border: 1px solid #dfe6ed;
    border-radius: 6px;
    background: #ffffff;
}

.asset-preview-item > img,
.asset-gallery-item img {
    width: 100%;
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
    background: #f2f5f7;
}

.asset-preview-item figcaption,
.asset-gallery-item figcaption {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 8px;
}

.asset-preview-item figcaption > span,
.asset-gallery-item figcaption > span {
    overflow: hidden;
    color: #475467;
    font-size: 9px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-preview-item figcaption small { color: #8792a0; font-size: 8px; }
.asset-preview-item > button,
.asset-gallery-item figcaption button { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 28px; padding: 0; border: 0; border-radius: 50%; background: #ffeded; color: #c84e4e; }
.asset-preview-item > button { position: absolute; top: 7px; right: 7px; box-shadow: 0 3px 9px rgba(23,32,51,.18); }
.asset-gallery-open { width: 100%; display: block; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.asset-inline-form { display: inline-flex; margin: 0; }

.asset-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 22px;
    background: #f6f8fa;
}

.asset-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    margin-top: 18px;
    border-top: 3px solid #316fd7;
    border-bottom: 1px solid #dfe6ed;
}

.asset-detail-info { border-right: 1px solid #e4e9ef; }
.asset-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); margin: 0; border-top: 1px solid #e4e9ef; }
.asset-detail-grid > div { min-width: 0; padding: 12px 10px; border-bottom: 1px solid #e4e9ef; }
.asset-detail-grid > div:nth-child(odd) { border-right: 1px solid #e4e9ef; }
.asset-detail-grid dt { color: #7a8797; font-size: 9px; font-weight: 800; }
.asset-detail-grid dd { margin: 4px 0 0; overflow-wrap: anywhere; color: #263445; font-size: 11px; font-weight: 800; }
.asset-description { margin-top: 16px; padding: 13px; border-left: 3px solid #17849d; background: #f2f8fa; }
.asset-description strong { color: #263445; font-size: 10px; }
.asset-description p { margin: 5px 0 0; color: #596779; font-size: 11px; line-height: 1.6; }
.asset-photo-submit { width: 100%; margin-top: 12px; }
.asset-existing-photos { margin-top: 18px; border-top: 3px solid #17849d; border-bottom: 1px solid #dfe6ed; }

.asset-lightbox {
    position: fixed;
    inset: 0;
    z-index: 4000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 30px;
    background: rgba(11, 22, 36, .9);
}

.asset-lightbox.is-open { display: flex; }
.asset-lightbox img { max-width: 94vw; max-height: 90vh; object-fit: contain; }
.asset-lightbox > button { position: fixed; top: 18px; right: 18px; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 50%; background: #ffffff; color: #263445; }

@media (max-width: 991.98px) {
    .asset-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .asset-form-grid { grid-template-columns: 1fr; }
    .asset-form-section:nth-child(odd) { border-right: 0; }
    .asset-detail-layout { grid-template-columns: 1fr; }
    .asset-detail-info { border-right: 0; border-bottom: 1px solid #e4e9ef; }
}

@media (max-width: 767.98px) {
    .asset-workspace { padding: 14px; }
    .asset-page-header { align-items: flex-start; flex-direction: column; }
    .asset-heading h1 { font-size: 20px; }
    .asset-header-actions { width: 100%; flex-wrap: wrap; }
    .asset-primary-action { width: 100%; }
    .asset-stats { grid-template-columns: 1fr 1fr; }
    .asset-stat { min-height: 72px; padding: 11px; }
    .asset-stat strong { font-size: 20px; }
    .asset-list-toolbar { align-items: stretch; flex-direction: column; }
    .asset-filters { align-items: stretch; flex-direction: column; }
    .asset-search, .asset-filters > select { width: 100%; min-width: 0; }
    .asset-fields-2 { grid-template-columns: 1fr; }
    .asset-detail-grid { grid-template-columns: 1fr; }
    .asset-detail-grid > div:nth-child(odd) { border-right: 0; }
    .asset-form-section, .asset-photo-section, .asset-existing-photos, .asset-photo-add, .asset-detail-info { padding: 16px; }
    .asset-form-actions { position: sticky; z-index: 10; bottom: 0; padding: 11px 16px; }
    .asset-form-actions .btn { flex: 1 1 auto; }
    .asset-preview-grid, .asset-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 420px) {
    .asset-stats { grid-template-columns: 1fr; }
    .asset-preview-grid, .asset-gallery { grid-template-columns: 1fr; }
}

/* Cargo photo gallery */
.kargo-photo-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    width: 100%;
}

.kargo-photo-item {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border: 1px solid #dfe6ed;
    border-radius: 6px;
    background: #ffffff;
}

.kargo-photo-open {
    width: 100%;
    display: block;
    padding: 0;
    border: 0;
    background: #f2f5f7;
    cursor: zoom-in;
}

.kargo-photo-open img {
    width: 100%;
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
}

.kargo-photo-item figcaption {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    padding: 8px;
}

.kargo-photo-item figcaption span {
    overflow: hidden;
    color: #526071;
    font-size: 9px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kargo-photo-item figcaption button {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ffeded;
    color: #c84e4e;
}

.kargo-photo-empty,
.kargo-photo-loading {
    min-height: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
    grid-column: 1 / -1;
    border: 1px dashed #cad3dc;
    border-radius: 6px;
    color: #8792a0;
    font-size: 10px;
}

@media (max-width: 575.98px) {
    .kargo-photo-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Cargo full-screen image viewer */
body.kargo-image-viewer-open { overflow: hidden !important; }

.kargo-image-viewer {
    position: fixed;
    inset: 0;
    z-index: 6000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(8, 17, 29, .94);
}

.kargo-image-viewer.is-open { display: flex; }

.kargo-image-viewer-shell {
    width: min(1280px, 100%);
    height: min(900px, calc(100vh - 44px));
    min-height: 0;
    display: grid;
    grid-template-rows: 58px minmax(0, 1fr) 62px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    background: #111d2b;
    box-shadow: 0 26px 80px rgba(0, 0, 0, .46);
}

.kargo-image-viewer-header,
.kargo-image-viewer-controls {
    display: flex;
    align-items: center;
    padding: 0 16px;
    background: #ffffff;
}

.kargo-image-viewer-header {
    justify-content: space-between;
    border-bottom: 1px solid #dfe6ed;
}

.kargo-image-viewer-header > div {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.kargo-image-viewer-header > div > span {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    border-radius: 50%;
    background: #e6f7f5;
    color: #087f78;
}

.kargo-image-viewer-header h5 {
    margin: 0;
    color: #253445;
    font-size: 14px;
    font-weight: 900;
}

.kargo-image-viewer button {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    padding: 0;
    border: 1px solid #dfe6ed;
    border-radius: 50%;
    background: #ffffff;
    color: #405167;
    cursor: pointer;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

.kargo-image-viewer button:hover,
.kargo-image-viewer button:focus {
    border-color: #17849d;
    background: #edf8fa;
    color: #087f78;
    outline: 0;
}

.kargo-image-viewer-stage {
    min-width: 0;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: auto;
    padding: 20px;
    background-color: #0c1622;
    background-image: linear-gradient(45deg, rgba(255,255,255,.035) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.035) 75%), linear-gradient(45deg, rgba(255,255,255,.035) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.035) 75%);
    background-position: 0 0, 12px 12px;
    background-size: 24px 24px;
}

.kargo-image-viewer-stage img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: contain;
    transform-origin: center;
    transition: transform .18s ease;
}

.kargo-image-viewer-controls {
    justify-content: center;
    gap: 8px;
    border-top: 1px solid #dfe6ed;
}

.kargo-image-viewer-controls > span {
    width: 1px;
    height: 24px;
    margin: 0 4px;
    background: #dfe6ed;
}

.kargo-image-viewer-controls [data-kargo-image-download] {
    border-color: #b9e4df;
    background: #e6f7f5;
    color: #087f78;
}

@media (max-width: 575.98px) {
    .kargo-image-viewer { padding: 0; }
    .kargo-image-viewer-shell { width: 100%; height: 100vh; border: 0; border-radius: 0; grid-template-rows: 54px minmax(0, 1fr) 58px; }
    .kargo-image-viewer-stage { padding: 10px; }
    .kargo-image-viewer-header { padding: 0 10px 0 14px; }
    .kargo-image-viewer-controls { padding: 0 10px; }
}

/* Hersley splash experience */
.login-splash,
.hm-page-transition {
    background: #dfecef;
}

.login-splash::before,
.hm-page-transition::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 8px;
    background: #0d2b3b;
}

.login-splash-content {
    width: min(760px, 100%);
    min-height: 430px;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #c9d9dd;
    border-radius: 8px;
    background: #ffffff;
    text-align: left;
    box-shadow: 0 28px 70px rgba(18, 47, 61, .22);
}

.login-splash-brand,
.hm-transition-brand {
    position: relative;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #0d2b3b;
    color: #ffffff;
}

.login-splash-brand {
    padding: 42px 32px;
}

.login-splash-logo {
    width: 216px;
    max-width: 100%;
    height: auto;
    display: block;
    padding: 0;
    margin: 0;
    border: 6px solid #ffffff;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .22);
}

.login-splash-brand-copy,
.hm-transition-brand-copy {
    display: flex;
    flex-direction: column;
    margin-top: 24px;
    letter-spacing: 0;
}

.login-splash-brand-copy strong,
.hm-transition-brand-copy strong {
    font-size: 15px;
    font-weight: 900;
}

.login-splash-brand-copy span,
.hm-transition-brand-copy span {
    margin-top: 3px;
    color: #9fc1ca;
    font-size: 9px;
    font-weight: 800;
}

.login-splash-colors,
.hm-transition-colors {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5px;
    margin-top: 20px;
}

.login-splash-colors span,
.hm-transition-colors span {
    height: 5px;
    border-radius: 2px;
}

.login-splash-colors span:nth-child(1),
.hm-transition-colors span:nth-child(1) { background: #16a89f; }
.login-splash-colors span:nth-child(2),
.hm-transition-colors span:nth-child(2) { background: #3b75d6; }
.login-splash-colors span:nth-child(3),
.hm-transition-colors span:nth-child(3) { background: #e76f51; }
.login-splash-colors span:nth-child(4),
.hm-transition-colors span:nth-child(4) { background: #e3ad32; }

.login-splash-status {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 42px 46px;
    background: #ffffff;
}

.login-splash-kicker,
.hm-transition-kicker {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 7px;
    margin-bottom: 25px;
    color: #087f78;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0;
}

.login-splash-indicator {
    width: 68px;
    height: 68px;
    margin: 0 0 25px;
    background: #e8f6f5;
    color: #087f78;
    box-shadow: none;
}

.login-splash-indicator::before {
    inset: -6px;
    border-color: #b8dedb;
    border-top-color: #087f78;
}

.login-splash h2 {
    color: #172b3a;
    font-size: 27px;
    font-weight: 900;
    letter-spacing: 0;
}

.login-splash p {
    margin: 9px 0 26px;
    color: #617181;
    font-size: 13px;
    line-height: 1.55;
}

.login-splash-progress {
    width: 100%;
    height: 6px;
    margin: 0 0 20px;
    border-radius: 3px;
    background: #e4edef;
}

.login-splash-progress span {
    background: #0f8f87;
}

.login-splash-meta,
.hm-transition-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.login-splash-meta small,
.hm-transition-meta small {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #788795;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
}

.login-splash-meta small i { margin: 0; color: #16865a; }
.login-splash.is-success .login-splash-brand { background: #123a35; }
.login-splash.is-success .login-splash-indicator { background: #16865a; color: #ffffff; }

.hm-page-transition {
    padding: 24px;
}

.hm-transition-inner {
    width: min(700px, 100%);
    min-height: 380px;
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #c9d9dd;
    border-radius: 8px;
    background: #ffffff;
    text-align: left;
    box-shadow: 0 28px 70px rgba(18, 47, 61, .25);
}

.hm-transition-brand {
    padding: 38px 30px;
}

.hm-transition-brand .hm-transition-logo {
    width: 190px;
    height: auto;
    margin: 0;
    overflow: hidden;
    border: 6px solid #ffffff;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .22);
}

.hm-transition-brand .hm-transition-logo img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0;
    object-fit: contain;
}

.hm-transition-status {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 38px 42px;
    background: #ffffff;
}

.hm-transition-indicator {
    position: relative;
    width: 62px;
    height: 62px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    border-radius: 50%;
    background: #e8f6f5;
    color: #087f78;
    font-size: 21px;
}

.hm-transition-indicator::after {
    content: "";
    position: absolute;
    inset: -6px;
    border: 2px solid #b8dedb;
    border-top-color: #087f78;
    border-radius: 50%;
    animation: hm-login-spin 850ms linear infinite;
}

.hm-transition-status h2 {
    color: #172b3a;
    font-size: 26px;
    font-weight: 900;
    letter-spacing: 0;
}

.hm-transition-status p {
    margin: 9px 0 25px;
    color: #617181;
    font-size: 13px;
    line-height: 1.5;
}

.hm-transition-status .hm-transition-progress {
    width: 100%;
    height: 6px;
    margin: 0 0 20px;
    border-radius: 3px;
    background: #e4edef;
}

.hm-transition-status .hm-transition-progress span { background: #0f8f87; }
.hm-transition-meta small i { margin: 0; color: #16865a; }
.hm-transition-meta small:last-child i { color: #16865a; font-size: 6px; }

/* Medical stock history search */
.hm-stock-page .hm-history-toolbar {
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 0 0 14px;
    background: #ffffff;
}

.hm-stock-page .hm-history-search {
    position: relative;
    min-width: 0;
    flex: 1 1 420px;
    margin: 0;
}

.hm-stock-page .hm-history-search > i {
    position: absolute;
    top: 50%;
    left: 13px;
    z-index: 1;
    color: #087f78;
    font-size: 12px;
    transform: translateY(-50%);
}

.hm-stock-page .hm-history-search input {
    width: 100%;
    height: 42px;
    padding: 0 38px;
    border: 1px solid #cfdbe0;
    border-radius: 6px;
    background: #f8fbfc;
    color: #253445;
    font-size: 12px;
    font-weight: 700;
    outline: 0;
}

.hm-stock-page .hm-history-search input:focus {
    border-color: #168f87;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(22, 143, 135, .12);
}

.hm-stock-page .hm-history-count {
    min-width: 92px;
    color: #526575;
    font-size: 10px;
    font-weight: 900;
    text-align: right;
    white-space: nowrap;
}

.hm-stock-page .hm-history-table-wrap {
    border: 1px solid #dbe4e8;
    border-radius: 6px;
}

.hm-stock-page .hm-history-no-result {
    height: 120px;
    color: #71808f;
    text-align: center;
}

.hm-stock-page .hm-history-no-result i {
    display: block;
    margin-bottom: 8px;
    color: #168f87;
    font-size: 22px;
}

.hm-stock-page .hm-history-no-result span {
    font-size: 11px;
    font-weight: 800;
}

@media (max-width: 700px) {
    .login-splash,
    .hm-page-transition { padding: 12px; }
    .login-splash-content,
    .hm-transition-inner { grid-template-columns: 1fr; min-height: 0; }
    .login-splash-brand,
    .hm-transition-brand { padding: 22px 24px; }
    .login-splash-logo,
    .hm-transition-brand .hm-transition-logo { width: 170px; }
    .login-splash-brand-copy,
    .hm-transition-brand-copy { display: none; }
    .login-splash-colors,
    .hm-transition-colors { width: 170px; margin-top: 14px; }
    .login-splash-status,
    .hm-transition-status { padding: 26px 24px 28px; }
    .login-splash-kicker,
    .hm-transition-kicker { margin-bottom: 20px; }
    .login-splash-indicator,
    .hm-transition-indicator { width: 58px; height: 58px; margin-bottom: 20px; }
    .login-splash h2,
    .hm-transition-status h2 { font-size: 22px; }
    .login-splash-meta,
    .hm-transition-meta { align-items: flex-start; flex-direction: column; gap: 7px; }
    .hm-stock-page .hm-history-toolbar { align-items: stretch; flex-direction: column; gap: 8px; }
    .hm-stock-page .hm-history-search { flex-basis: auto; }
    .hm-stock-page .hm-history-count { min-width: 0; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
    .hm-transition-indicator::after { animation: none; }
}

/* Hospital and general current-account actions */
.hm-cari-page .container-fluid {
    padding: 0 !important;
}

.hm-cari-workspace {
    min-width: 0;
    padding: 0 2px 28px;
}

.hm-cari-page-header {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 20px;
    padding: 4px 2px 18px;
    border-bottom: 1px solid #dbe4e8;
}

.hm-cari-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

.hm-cari-heading-icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    border-radius: 50%;
    color: #ffffff;
    font-size: 18px;
}

.hm-cari-heading-hospital { background: #316fd7; }
.hm-cari-heading-general { background: #087f78; }

.hm-cari-heading small {
    display: block;
    margin-bottom: 2px;
    color: #087f78;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0;
}

.hm-cari-heading h1 {
    margin: 0;
    color: #203344;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 0;
}

.hm-cari-heading p {
    margin: 3px 0 0;
    color: #6c7c8b;
    font-size: 11px;
}

.hm-cari-page-actions {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    flex: 0 1 auto;
}

.hm-cari-page-actions .hm-cari-action {
    width: auto !important;
    min-width: 0 !important;
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px;
    margin: 0 !important;
    padding: 6px 14px 6px 7px !important;
    border: 0 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 7px 17px rgba(28, 58, 77, .14) !important;
}

.hm-cari-page-actions .hm-cari-action-new { background: #316fd7 !important; }
.hm-cari-page-actions .hm-cari-action-total { background: #087f78 !important; }
.hm-cari-page-actions .hm-cari-action-new:hover { background: #285fbb !important; }
.hm-cari-page-actions .hm-cari-action-total:hover { background: #066b66 !important; }

.hm-cari-action > span {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .17);
    color: #ffffff;
    font-size: 11px;
}

.hm-cari-action > strong {
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.25;
    text-align: left;
    white-space: nowrap;
}

.hm-cari-row-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.hm-cari-row-actions .btn {
    min-width: 78px !important;
    min-height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px;
    margin: 0 !important;
    padding: 6px 10px !important;
    border: 0 !important;
    border-radius: 5px !important;
    color: #ffffff !important;
    font-size: 9px !important;
    font-weight: 900 !important;
}

.hm-cari-row-actions .btn-sil { background: #c84e4e !important; }
.hm-cari-row-actions .btn-guncelle { background: #b77913 !important; }
.hm-cari-row-actions .btn i { margin: 0 !important; font-size: 10px; }

@media (max-width: 1050px) {
    .hm-cari-page-header { align-items: flex-start; flex-direction: column; }
    .hm-cari-page-actions { width: 100%; justify-content: flex-start; }
}

@media (max-width: 575.98px) {
    .hm-cari-workspace { padding-right: 0; padding-left: 0; }
    .hm-cari-page-header { padding-right: 2px; padding-left: 2px; }
    .hm-cari-heading { align-items: flex-start; }
    .hm-cari-heading-icon { width: 42px; height: 42px; flex-basis: 42px; font-size: 15px; }
    .hm-cari-heading h1 { font-size: 19px; }
    .hm-cari-page-actions { display: grid; grid-template-columns: 1fr; }
    .hm-cari-page-actions .hm-cari-action { width: 100% !important; justify-content: flex-start !important; }
    .hm-cari-action > strong { white-space: normal; }
}